定位多個 html 文件時，Usemin 創建 ELIFECYCLE 錯誤

Question

我目前正在學習 Coursera 上的“前端 Web UI 框架和工具：Bootstrap 4”課程，並且遇到了 NPM 腳本的問題。 在我的 package.json 文件中創建腳本以最小化文件並將它們傳輸到分發文件夾時，我不斷收到 ELIFECYCLE 錯誤，同時嘗試在我的根文件夾中的三個單獨的 html 文件上運行 usemin 腳本。 在我的一生中，我無法弄清楚為什么我不斷收到此錯誤，因為它完全按照課堂上所教的方式編寫。 我還嘗試單獨對這些文件使用 usemin，其中一個文件有效，但其他兩個無效。 任何幫助將不勝感激，因為我對編程非常缺乏經驗，我正在嘗試通過像這樣的在線課程學習更多知識，並且已經在這個問題上停留了一個多星期。 我也無法通過谷歌搜索找到有關此問題的任何有用信息。

{
  "name": "confusion",
  "version": "1.0.0",
  "description": "This is a website for Ristorante Con Fusion",


  "main": "index.html",
  "scripts": {
    "start": "npm run watch:all",
    "test": "echo \"Error: no test specified\" && exit 1",
    "lite": "lite-server",
    "scss": "node-sass -o css/ css/",
    "watch:scss": "onchange \"css/*.scss\" -- npm run scss",
    "watch:all": "parallelshell \"npm run watch:scss\" \"npm run lite\"",
    "clean": "rimraf dist",
    "copyfonts": "copyfiles -f node_modules/font-awesome/fonts/* dist/",
    "imagemin": "imagemin img/* -o dist/img",
    "usemin": "usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html",
    "build": "npm run clean && npm run copyfonts && npm run imagemin && npm run usemin"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "copyfiles": "^2.1.0",
    "cssmin": "^0.4.3",
    "htmlmin": "0.0.7",
    "imagemin": "^6.1.0",
    "lite-server": "^2.3.0",
    "node-sass": "^4.11.0",
    "onchange": "^3.3.0",
    "parallelshell": "^3.0.1",
    "rimraf": "^2.6.2",
    "uglifyjs": "^2.4.11",
    "usemin": "^0.5.0",
    "usemin-cli": "^0.5.1"
  },
  "dependencies": {
    "bootstrap": "^4.0.0",
    "bootstrap-social": "^5.1.1",
    "font-awesome": "^4.7.0",
    "jquery": "^3.3.1",
    "popper.js": "^1.12.9"
  }
}

這是我收到的錯誤日志：

    0 info it worked if it ends with ok
    1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
    1 verbose cli   'C:\\Users\\User\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js',
    1 verbose cli   'run',
    1 verbose cli   'usemin' ]
    2 info using npm@6.5.0
    3 info using node@v10.13.0
    4 verbose run-script [ 'preusemin', 'usemin', 'postusemin' ]
    5 info lifecycle confusion@1.0.0~preusemin: confusion@1.0.0
    6 info lifecycle confusion@1.0.0~usemin: confusion@1.0.0
    7 verbose lifecycle confusion@1.0.0~usemin: unsafe-perm in lifecycle true
    8 verbose lifecycle confusion@1.0.0~usemin: PATH: C:\Users\User\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\User\Desktop\Programming Courses\CoursEra\Front-End Web UI Frameworks and Tools\Bootstrap4\conFusion\node_modules\.bin;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Skype\Phone\;C:\Program Files\nodejs\;C:\Program Files\Git\cmd;C:\Program Files\Sublime Text 3;C:\Users\User\AppData\Roaming\npm
    9 verbose lifecycle confusion@1.0.0~usemin: CWD: C:\Users\User\Desktop\Programming Courses\CoursEra\Front-End Web UI Frameworks and Tools\Bootstrap4\conFusion
    10 silly lifecycle confusion@1.0.0~usemin: Args: [ '/d /s /c',
    10 silly lifecycle   'usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html' ]
    11 silly lifecycle confusion@1.0.0~usemin: Returned: code: 1  signal: null
    12 info lifecycle confusion@1.0.0~usemin: Failed to exec usemin script
    13 verbose stack Error: confusion@1.0.0 usemin: `usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html`
    13 verbose stack Exit status 1
    13 verbose stack     at EventEmitter.<anonymous> (C:\Users\User\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\index.js:301:16)
    13 verbose stack     at EventEmitter.emit (events.js:182:13)
    13 verbose stack     at ChildProcess.<anonymous> (C:\Users\User\AppData\Roaming\npm\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
    13 verbose stack     at ChildProcess.emit (events.js:182:13)
    13 verbose stack     at maybeClose (internal/child_process.js:962:16)
    13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:251:5)
    14 verbose pkgid confusion@1.0.0
    15 verbose cwd C:\Users\User\Desktop\Programming Courses\CoursEra\Front-End Web UI Frameworks and Tools\Bootstrap4\conFusion
    16 verbose Windows_NT 6.1.7601
    17 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\User\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js" "run" "usemin"
    18 verbose node v10.13.0
    19 verbose npm  v6.5.0
    20 error code ELIFECYCLE
    21 error errno 1
    22 error confusion@1.0.0 usemin: `usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html`
    22 error Exit status 1
    23 error Failed at the confusion@1.0.0 usemin script.
    23 error This is probably not a problem with npm. There is likely additional logging output above.
    24 verbose exit [ 1, true ]

Answer 1

我正在做同樣的課程並且有類似的錯誤。 但是，我只能修復它。 我通過重新安裝所有開發依賴項並使用當前版本而不是課程中的版本來做到這一點。 我也將 usemin 命令（根據我在此處找到的另一個來源）更改為

"imagemin": "imagemin img/* --out-dir=dist/img",

但是，它仍然不起作用，因此我使用以下工具檢查了所有文件是否有錯誤：

https://www.freeformatter.com/java-regex-tester.html用於測試 html 文件； http://www.webtoolkitonline.com/javascript-tester.html ，用於測試 .js 文件和https://jsonlint.com/?json= ，用於測試 package.json 文件的錯誤。

在我更正所有文件后，命令“npm run build”終於起作用了。

Answer 2

我也遇到了同樣的問題，但這是我得到的錯誤：

 > coursera_1@1.0.0 build > npm run clean && npm run imagemin && npm run copyfonts && npm run usemin > coursera_1@1.0.0 clean > rimraf dist > coursera_1@1.0.0 imagemin > imagemin img/* --out-dir='dist/img' 14 images minified > coursera_1@1.0.0 copyfonts > copyfiles -f node_modules/font-awesome/fonts/* dist/fonts > coursera_1@1.0.0 usemin > usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html undefined:1625 throw new JS_Parse_Error(message, filename, line, col, pos); ^ JS_Parse_Error [SyntaxError]: Unexpected token: punc ()) at JS_Parse_Error.get (eval at <anonymous> (/home/alfred/Desktop/coursera_1/node_modules/usemin/node_modules/uglify-js/tools/node.js:27:1), <anonymous>:86:23) at formatError (internal/util/inspect.js:1140:38) at formatRaw (internal/util/inspect.js:910:14) at formatValue (internal/util/inspect.js:765:10) at inspect (internal/util/inspect.js:310:10) at afterInspector (internal/errors.js:718:14) { filename: 'js/scripts.js', line: 8, col: 27, pos: 220 }

我該怎么辦？？