vaadin / base-starter-angular Goto Github PK

View Code? Open in Web Editor NEW

13.0 11.0 5.0 429 KB

Base Starter for Vaadin components with Angular

Home Page: https://vaadin.com/start

TypeScript 81.51% JavaScript 10.35% HTML 7.29% CSS 0.86%

webcomponents angular5 angular vaadin-elements vaadin starter-project

base-starter-angular's Introduction

Base Starter for Vaadin components with Angular

Prerequisites

First install yarn.

Build Setup

# install dependencies
$ yarn install

# serve with hot reload at localhost:4200
$ yarn start

# build for production with minification
$ yarn build

This project was generated with Angular CLI version 7.0.3.

To get more help check out the Angular CLI README.

Recreating this project

$ yarn global add @angular/cli
$ ng new hello-angular
$ cd hello-angular

$ yarn add @vaadin/vaadin-core

In src/app/app.module.ts:

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

...and inside @NgModule add:

schemas: [CUSTOM_ELEMENTS_SCHEMA],

In src/app/app.component.ts:

import '@vaadin/vaadin-button/vaadin-button.js';
import '@vaadin/vaadin-text-field/vaadin-text-field.js';

In src/app/app.component.html:

<vaadin-text-field #textField placeholder="Type Something"></vaadin-text-field>
<vaadin-button (click)='title=textField.value'>Click Me!</vaadin-button>
<h2>Hello {{title}}!</h2>

base-starter-angular's People

Contributors

Stargazers

Watchers

Forkers

peppe pavlser peterblazejewicz pks-os tulioag

base-starter-angular's Issues

Angular content update

How to update template to v8:

migrate angular-cli.json to angular.json (should be done in v6 migration)
migrate Http modules
migrate builders to v8
Automatic migration fails due to some minor differences in project structure left from older version.
I'll make a PR shortly.

Update starter to use Angular CLI 7.0

We should regenerate the starter using latest @angular/cli and make sure it works nicely.

Local workspace file ('angular.json') could not be found.

hoehmann@XXXXX MINGW64 /d/Dev/git/base-starter-angular (master)
$ ng serve
Local workspace file ('angular.json') could not be found.
Error: Local workspace file ('angular.json') could not be found.
at WorkspaceLoader._getProjectWorkspaceFilePath (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\workspace-loader.js:37:19)
at WorkspaceLoader.loadWorkspace (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\workspace-loader.js:24:21)
at ServeCommand._loadWorkspaceAndArchitect (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\architect-command.js:195:32)
at ServeCommand. (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\architect-command.js:47:25)
at Generator.next ()
at C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\architect-command.js:7:71
at new Promise ()
at __awaiter (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\architect-command.js:3:12)
at ServeCommand.initialize (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\architect-command.js:46:16)
at Object. (C:\Users\hoehmann\AppData\Roaming\npm\node_modules@angular\cli\models\command-runner.js:87:23)

Add webcomponents polyfill to the bundle instead of using unpkg

Waiting for webcomponents/webcomponentsjs#1049 to be released.

Not able to install vaadin-core

when trying to install bower vaadin-code, below exception is thrown
bower ENOTFOUND Package vaadin-core not found.

Update vaadin-core to beta9

Add customized Lumo

It would be really nice to have included a small customization to the lumo theme (e.g. changing the base color) as it is really hard (at least for a beginner) to find out on how/where to do this, whereas it is a common use case.

Adding vaadin-password-field leads to an exception

I tried to add a password-field by adding <vaadin-password-field></vaadin-password-field> to app.component.html and import '@vaadin/vaadin-text-field/vaadin-password-field.js'; in app.component.ts

Unfortunately, I get the following exception on runtime:
zone.js:682 Unhandled Promise rejection: Object prototype may only be an Object or null: undefined ; Zone: <root> ; Task: Promise.then ; Value: TypeError: Object prototype may only be an Object or null: undefined at setPrototypeOf (<anonymous>) at Module.__extends (tslib.es6.js:25) at vaadin-password-field.js:45 at Module../node_modules/@vaadin/vaadin-text-field/src/vaadin-password-field.js (vaadin-password-field.js:156) at __webpack_require__ (bootstrap:83) at Module../node_modules/@vaadin/vaadin-text-field/theme/lumo/vaadin-password-field.js (vaadin-password-field.js:1) at __webpack_require__ (bootstrap:83) at Module../node_modules/@vaadin/vaadin-text-field/vaadin-password-field.js (vaadin-password-field.js:1) at __webpack_require__ (bootstrap:83) at Module../src/app/app.component.ts (0.js:11700) TypeError: Object prototype may only be an Object or null: undefined at setPrototypeOf (<anonymous>) at Module.__extends (http://localhost:4200/vendor.js:77134:5) at http://localhost:4200/0.js:9537:52 at Module../node_modules/@vaadin/vaadin-text-field/src/vaadin-password-field.js (http://localhost:4200/0.js:9648:2) at __webpack_require__ (http://localhost:4200/runtime.js:84:30) at Module../node_modules/@vaadin/vaadin-text-field/theme/lumo/vaadin-password-field.js (http://localhost:4200/0.js:10431:87) at __webpack_require__ (http://localhost:4200/runtime.js:84:30) at Module../node_modules/@vaadin/vaadin-text-field/vaadin-password-field.js (http://localhost:4200/0.js:10501:94) at __webpack_require__ (http://localhost:4200/runtime.js:84:30) at Module../src/app/app.component.ts (http://localhost:4200/0.js:11700:108)

Any ideas?

vaadin / base-starter-angular Goto Github PK

base-starter-angular's Introduction

Base Starter for Vaadin components with Angular

Prerequisites

Build Setup

Recreating this project

base-starter-angular's People

Contributors

Stargazers

Watchers

Forkers

base-starter-angular's Issues

Recommend Projects

Recommend Topics

Recommend Org