2016-12-24 154 views
2

我一直在閱讀類似的堆棧溢出,但我一直無法弄清楚。我必須錯過一小步。相對路徑。 baseUrl和路徑不能在ionic2上工作 - angular2

我的目標是能夠做到:的

import { Logger } from 'logging' 

代替

import { Logger } from '../../modules/logging' 

我tsconfig看起來是這樣的:

{ 
    "compilerOptions": { 
    "allowSyntheticDefaultImports": true, 
    "declaration": false, 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "lib": [ 
     "dom", 
     "es2015" 
    ], 
    "module": "commonjs", 
    "moduleResolution": "node", 
    "sourceMap": true, 
    "target": "es5", 
    "baseUrl": ".", 
    "paths":{ 
     "*":[ 
     "src/app/*", 
     "node_modules/*" 
     ] 
    } 
    }, 
    "include": [ 
    "src/**/*.ts" 
    ], 
    "exclude": [ 
    "node_modules" 
    ], 
    "compileOnSave": false, 
    "atom": { 
    "rewriteTsconfig": false 
    } 
} 

我的文件夾結構是一樣的東西

src 
--- app 
------- logging 
--------------- index.ts (contains exports for the provider and the ngModule) 
--------------- logger.provider.ts (contains an injectable provider) 
--------------- logging.module.ts (contains the ngModule) 
--- app.module.ts 

該指數主要有這樣的:

export { LoggingModule } from './logging.module'; 
export { LoggerProvider } from './logger.provider'; 

當然,我從結構上省去文件。 app.module.ts是我正在嘗試導入「日誌記錄」模塊的入口類。 Visual Studio代碼不會抱怨我的導入。

//import { FIREBASE_CONFIG } from 'configs'; 
import { NgModule, ErrorHandler } from '@angular/core'; 
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular'; 
import { MyApp } from './app.component'; 
import { HomePage } from '../pages/home/home'; 
import { AngularFireModule } from "angularfire2"; 
import { LoggingModule } from 'logging'; 
import { PostsModule } from 'posts'; 

@NgModule({ 
    declarations: [ 
    MyApp, 
    HomePage 
    ], 
    imports: [ 
    IonicModule.forRoot(MyApp), 
    PostsModule, 
    LoggingModule 
    //AngularFireModule.initializeApp(FIREBASE_CONFIG), 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    HomePage 
    ], 
    providers: [{provide: ErrorHandler, useClass: IonicErrorHandler}] 
}) 
export class AppModule {} 

正如我所說的VSC不顯示任何錯誤,但是當我在瀏覽器中啓動應用程序,我得到:

Error: Cannot find module "logging" 
    at Object.<anonymous> (http://localhost:8100/build/main.js:82202:7) 
    at __webpack_require__ (http://localhost:8100/build/main.js:20:30) 
    at Object.<anonymous> (http://localhost:8100/build/main.js:105047:70) 
    at __webpack_require__ (http://localhost:8100/build/main.js:20:30) 
    at http://localhost:8100/build/main.js:66:18 
    at http://localhost:8100/build/main.js:69:10 

我真的不想回落到相對長的路線因爲1)它很乏味,2)會在應用程序增長時重構惡夢。

謝謝!

+0

據我所知,如果你從同一個項目導入你自己的模塊,你需要使用相對url。如果它是從npm安裝的,那麼它只會導入沒有相對url的文件,這將是'package.json'中列出的模塊。 – adriancarriger

+1

嘗試在''app''中使用'tsc --traceResolution'' – raj

+0

https://paste.ee/p/bXxZx – yafrack

回答

0

我懷疑moduleResolution設置爲node可能會導致問題。將其更改爲classic並查看它是否已解決。

"compilerOptions": { 
    "moduleResolution": "classic" 

看看這個issue。希望它解決了這個錯誤。

+0

嗨。謝謝。我自己並沒有補充說,它是離子裝置的一部分。事情是,將它改爲經典可以打破一切。即:無法找到名稱'Observable',無法找到名稱'AngularFireDatabase'等。 – yafrack

+0

沒有路徑包含node_modules文件夾? – raj

+0

是的,它被添加:/ – yafrack