Angular-cli构建生成的CSS不在DOM中解释

Question

我在使用@ angular/cli构建我的Angular 2应用程序时目前遇到了问题。

当我运行纳克构建--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": { 
    } 
    } 
} 

Answer 1

它与我的nginx配置是一个mime类型的问题。

根据Kind用户，我回顾了Resource interpreted as stylesheet but transferred with MIME type text/html (seems not related with web server)的评论，并最终检查了我的nginx配置，并且足够准确，mime-types在我的自定义配置中没有定义。