我在使用@ 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": {
}
}
}
發佈您的'angular-cli.json'文件。 –
已添加.angular-cli.json文件@Kinduser –
我不是100%確定的,但是您錯過了'angular-cli.json'文件中'assets'數組中的'styles.css'文件。添加並重試。順便說一句 - Angular期待'css'文件,您正在使用'style.scss'。 –