Question

我在我的angular应用程序中使用Angular cli 7.1.4和bootstrap 4.2.1。

Angular.json文件：

"architect": {
   "build": {
      "options": {
          "styles": [
          "node_modules/bootstrap/scss/bootstrap.scss",              
          "src/styles.scss"
        ]
      },
     "configurations": {
        "localrelease": {
          "fileReplacements": [
            {
              "replace": "src/environments/environment.ts",
              "with": "src/environments/environment.localrelease.ts"
            }
          ],
          "optimization": true,
          "outputHashing": "all",
          "sourceMap": false,
          "extractCss": true,
          "namedChunks": false,
          "aot": true,
          "extractLicenses": true,
          "vendorChunk": false,
          "buildOptimizer": true,
          "budgets": [
            {
              "type": "initial",
              "maximumWarning": "2mb",
              "maximumError": "5mb"
            }
          ]
        }
   }
}

styles.scss：

// Theme variables, must be included before the libraries to allow 
   overriding defaults   

// 3rd party libraries
@import "~bootstrap/scss/bootstrap";

问题是，当我使用'ng build --configuration localrelease'构建项目时，浏览器控制台输出以下错误：

styles.9d1b9f2acfda72d82b52.css:6 Uncaught SyntaxError: Unexpected token :

styles.css：

/*!
 * Bootstrap v4.2.1 (https://getbootstrap.com/)
 * Copyright 2011-2018 The Bootstrap Authors
 * Copyright 2011-2018 Twitter, Inc.
 * Licensed under MIT         
  */:root{--blue:#007bff;--indigo:#6610f2;--purple:#6f42c1;--pink:#e83e8

显然，问题出在第3方库（引导程序）上。谁能补充我在做什么错呢？非常感谢。

Answer 1

"styles": [
      "node_modules/bootstrap/scss/bootstrap.scss",              
      "src/styles.scss"
    ]

当您执行@import "~bootstrap/scss/bootstrap";时，它会再次添加。尝试删除其中之一。

Angular CLI 7.1.4提取的styles.css文件意外字符

1 个答案: