2017-06-04 111 views
0

我真的在爲我的Angular 2(4版)應用集成OnsenUI而苦苦掙扎。該項目是使用最新的Angular CLI生成的。 看來OnsenUI文檔並不是最新的。在角4集成OnsenUI 4

所以,如果添加

import {OnsenModule} from 'angular2-onsenui'; 
import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core'; 
. 
. 
. 
@NgModule({ 
imports: [ 
    OnsenModule, 
    BrowserModule 
], 
schemas: [CUSTOM_ELEMENTS_SCHEMA] 

,因爲它是在文檔中描述: https://onsen.io/v2/docs/guide/angular2/

,我發現了以下錯誤:

Uncaught ReferenceError: ons is not defined 
at Object../node_modules/angular2-onsenui/dist/src/ons/notification.js (notification.js:5) 
at __webpack_require__ (bootstrap 43794b3…:54) 
at Object../node_modules/angular2-onsenui/dist/src/angular2-onsenui.js (angular2-onsenui.js:16) 
at __webpack_require__ (bootstrap 43794b3…:54) 
at Object../src/app/app.module.ts (app.component.ts:12) 
at __webpack_require__ (bootstrap 43794b3…:54) 
at Object../src/main.ts (environment.ts:8) 
at __webpack_require__ (bootstrap 43794b3…:54) 
at Object.2 (main.ts:12) 
at __webpack_require__ (bootstrap 43794b3…:54) 
./node_modules/angular2-onsenui/dist/src/ons/notification.js @ 
notification.js:5 
__webpack_require__ @ bootstrap 43794b3…:54 
./node_modules/angular2-onsenui/dist/src/angular2-onsenui.js @  angular2-onsenui.js:16 
__webpack_require__ @ bootstrap 43794b3…:54 
./src/app/app.module.ts @ app.component.ts:12 
__webpack_require__ @ bootstrap 43794b3…:54 
./src/main.ts @ environment.ts:8 
__webpack_require__ @ bootstrap 43794b3…:54 
2 @ main.ts:12 
__webpack_require__ @ bootstrap 43794b3…:54 
webpackJsonpCallback @ bootstrap 43794b3…:25 
(anonymous) @ main.bundle.js:1 

我不希望使用monaca模板,這不會解決問題。

回答

1

終於得到了解決: 只要OnsenUI不支持角4,您需要將以下添加到.angular_cli.json

"styles": [ 
    "../node_modules/onsenui/css/onsen-css-components.css", 
    "../node_modules/onsenui/css/onsenui.css" 
    ], 
    "scripts": [ 
    "../node_modules/onsenui/js/onsenui.js" 
    ], 
0

完全相同的問題。但是,安裝angular-cli依賴項並更新.angular-cli.json並不適用於我(原始位置,我的項目不是由angular-cli生成的)。 看來他們正在努力角4支持:

https://github.com/OnsenUI/OnsenUI/tree/angular4-support

拭目以待......

+0

我已經運行結束一個GitHub庫與角4 + OnsenUI種子,也許你可以解決通過比較源代碼問題。 https://github.com/btxtiger/cordova-angular-onsenui – btx

+0

謝謝!我會檢查出來的 – Michat