2017-03-03 55 views
0

我在使用@ angular/cli構建我的Angular 2應用程序時目前遇到了問題。Angular-cli構建生成的CSS不在DOM中解釋

當我運行納克構建--prod生成一個DIST建設,一切工作了罰款,但所產生的styles.7b24f3befc9c595b00b9.bundle.css沒有得到正確的瀏覽器解釋,因此樣式不應用。

我在控制檯中看到有一個消息,說:

Resource interpreted as Stylesheet but transferred with MIME type application/octet-stream: "http://angular2.local/styles.7b24f3befc9c595b00b9.bundle.css". 

CSS文件內容本身是正確的,因爲複製/粘貼代碼到代碼中適當被通過和樣式應用的瀏覽器解釋元素。

任何幫助,將不勝感激,提前

感謝

澄清:一切正常發展(NG版本),而是試圖建立PROD(NG建立--prod)的樣式時,唐沒有得到正確的解釋。除了生產標誌外,開發和生產環境.ts文件都是相同的。

P.S.這裏是我的版本: @角/ CLI:1.0.0-rc.0 節點:6.9.2 OS:達爾文64

@angular/cli: 1.0.0-rc.0 
@angular/common: 2.4.8 
@angular/compiler: 2.4.8 
@angular/core: 2.4.8 
@angular/forms: 2.4.8 
@angular/http: 2.4.8 
@angular/platform-browser: 2.4.8 
@angular/platform-browser-dynamic: 2.4.8 
@angular/router: 3.4.8 
@angular/compiler-cli: 2.4.8 

.angular-cli.json

{ 
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 
    "project": { 
    "name": "angular2" 
    }, 
    "apps": [ 
    { 
     "root": "src", 
     "outDir": "dist", 
     "assets": [ 
     "assets", 
     "favicon.ico" 
     ], 
     "index": "index.html", 
     "main": "main.ts", 
     "polyfills": "polyfills.ts", 
     "test": "test.ts", 
     "tsconfig": "tsconfig.app.json", 
     "testTsconfig": "tsconfig.spec.json", 
     "prefix": "app", 
     "styles": [ 
     "../node_modules/font-awesome/css/font-awesome.css", 
     "../node_modules/primeng/resources/themes/bootstrap/theme.css", 
     "../node_modules/primeng/resources/primeng.min.css", 
     "../node_modules/nvd3/build/nv.d3.min.css", 
     "assets/AmazeUI/css/amazeui.css", 
     "assets/AmazeUI/css/admin.css", 
     "style.scss" 
     ], 
     "scripts": [ 
     "../node_modules/jquery/dist/jquery.min.js", 
     "../node_modules/d3/d3.min.js", 
     "../node_modules/nvd3/build/nv.d3.min.js", 
     "../node_modules/amazeui/dist/js/amazeui.js", 
     "../node_modules/moment/moment.js" 
     ], 
     "environmentSource": "environments/environment.ts", 
     "environments": { 
     "dev": "environments/environment.ts", 
     "prod": "environments/environment.prod.ts" 
     } 
    } 
    ], 
    "e2e": { 
    "protractor": { 
     "config": "./protractor.conf.js" 
    } 
    }, 
    "lint": [ 
    { 
     "project": "src/tsconfig.app.json" 
    }, 
    { 
     "project": "src/tsconfig.spec.json" 
    }, 
    { 
     "project": "e2e/tsconfig.e2e.json" 
    } 
    ], 
    "test": { 
    "karma": { 
     "config": "./karma.conf.js" 
    } 
    }, 
    "defaults": { 
    "styleExt": "scss", 
    "component": { 
    } 
    } 
} 
+0

發佈您的'angular-cli.json'文件。 –

+0

已添加.angular-cli.json文件@Kinduser –

+0

我不是100%確定的,但是您錯過了'angular-cli.json'文件中'assets'數組中的'styles.css'文件。添加並重試。順便說一句 - Angular期待'css'文件,您正在使用'style.scss'。 –

回答