Question

在Angular 6应用程序的index.html中添加以下样式时，我遇到以下错误。

拒绝应用以下样式 “ http://localhost:1234/node_modules/primeicons/primeicons.css”是因为其MIME类型（'text / html'）不是受支持的样式表MIME类型，并启用了严格的MIME检查。

  <link rel="stylesheet" type="text/css" href="/node_modules/primeicons/primeicons.css" />
  <link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/themes/nova-light/theme.css" />
  <link rel="stylesheet" type="text/css" href="/node_modules/primeng/resources/primeng.min.css" />

我应该如何解决此错误？

Answer 1

与其在index.html中添加样式，不如在下面的style.css文件中添加样式

Style.css

  @import '~primeicons/primeicons.css';
  @import '~primeng/resources/themes/nova-light/theme.css';
  @import '~primeng/resources/primeng.min.css';

希望这会有所帮助！

Answer 2

您有几种选择，以及如何导入样式。

导入CSS

styles.css

@import '~primeicons/primeicons.css';
@import '~primeng/resources/themes/nova-light/theme.css';
@import '~primeng/resources/primeng.min.css';

或将它们添加到angular.json

您还可以将它们添加到angular.json文件中。

{
 ...
   "projects": {
    "yourProjectName": {
      ...
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist/SkolniPanely",
            "index": "src/index.html",
            "main": "src/main.ts",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.app.json",
            "assets": [
              "src/favicon.png",
              "src/assets",
              "src/manifest.json"
            ],
            "styles": [
              //Here you can add *.css files
            ],
            "scripts": [
              //Here you can add *.js files
            ]
          },
          ...

拒绝应用'http：// localhost：1234 / node_modules / primeicons / primeicons.css'中的样式，因为其MIME类型（'text / html'）

2 个答案: