Question

将我的全局Angular CLI升级到1.7.3版后出现此错误（不确定是否打破了构建）。 Web包似乎不再理解路径引用。

{
  "name": "admin",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^4.4.4",
    "@angular/cdk": "^2.0.0-beta.12",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/material": "^2.0.0-beta.12",
    "@angular/platform-browser": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/router": "^4.0.0",
    "angular2-notifications": "^0.7.8",
    "core-js": "^2.4.1",
    "ng2-progressbar": "^1.3.0",
    "ngx-progressbar": "^2.0.8",
    "rxjs": "^5.1.0",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@angular/cli": "^1.5.2",
    "@angular/compiler-cli": "^4.0.0",
    "@angular/language-service": "^4.0.0",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "~3.0.1",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.0.4",
    "tslint": "~5.3.2",
    "typescript": "~2.3.3",
    "node-sass": "4.7.2"
  }
}

我的Package.json在下面，我添加了将node-sass锁定到版本4.7.2，因为有人建议这就是打破webpack构建但仍然遇到上述错误。

<head>

Answer 1

将URL作为字符串传递。这样：

li.ext_xml {

7102 | background：url（“../ img / filetree / code.png”）左上角不重复; | ^ 7103 | }

Answer 2

问题是@angular/cli@1.7.3使用Webpack@3.11无法识别上述屏幕截图中css中的路径。

我不得不降级到@angular/cli@1.5.6，后者使用成功构建项目的@webpack@3.8。

Answer 3

将第7102行中的代码更改为

background: url("../img/filetree/code.png") left top no-repeat;

也将7015更改为

 background: url("../img/filetree/zip.png") left top no-repeat;

Answer 4

这看起来像是最新的角度CLI版本的已知问题。

在没有引号的情况下说明背景网址是完全有效的。这已经在stackoverflow上得到了解答，它是有效的语法。

CSS background-image - What is the correct usage?

它之前有效，但自升级以来没有，所以这或者指向新版本中的错误，或者新版本可能更严格，但CSS语法看起来很好。

搜索错误我发现了以下内容：
Can't resolve SVGID after upgrading to 1.7
Ng build fails. CssSyntaxError since 1.7.0-rc.0
fix(@angular/cli): improve processing multi-line url() CSS rules

在1.7.3版本发布后，修复程序被合并到主分支中，所以我希望在1.7.3之后的下一个版本中修复你的问题。

Angular项目中的Webpack错误

4 个答案: