无法启动 webpack / 找不到 webpack



我想启动 webpack。我键入此命令

npm run dev

在我的项目所在的命令外壳中,node_modules所在的位置。我在终端中收到此错误:

> clear; npm run --silent sound:trash; ./bin/webpack --env development --watch; npm run --silent sound:microwave
[3;J


sh: 1: ./bin/webpack: not found

我查看了node_modules/bin/,有一个名为webpack的文件。有人可以帮助我吗?我是堆栈溢出的新手,也是使用 webpack 的新手。

包 JSON

{
  "name": "xxx",
  "version": "1.1.0",
  "description": "",
  "main": "src/js/init.js",
  "scripts": {
    "sound:plock": "play -q -v 0.2 $(find /usr/share/sounds/ -type f -name *device-added* | head -n 1)",
    "sound:microwave": "play -q -v 0.1 $(find /usr/share/sounds/ -type f -name *complete* | head -n 1)",
    "sound:trash": "play -q -v 0.15 $(find /usr/share/sounds/ -type f -name *trash*  | head -n 1)",
    "clean:js": "rm $(find ./static/ -type f -regex '.*\.[jt]sx?'); npm run --silent sound:trash",
    "clean:dir": "rm -rf ./static; npm run --silent sound:trash",
    "build": "clear; npm run --silent clean:dir; ./node_modules/.bin/webpack --env production --progress; npm run --silent sound:microwave",
    "build:server": "./node_modules/.bin/webpack --env production --progress",
    "dev": "clear; npm run --silent sound:trash; ./bin/webpack --env development --watch; npm run --silent sound:microwave",
    "test": "clear; npm run --silent build; ./bin/mocha --compilers js:babel-core/register --require jsdom-global/register; npm run --silent sound:plock",
    "test:monitor": "nodemon -x "rm -rf ./build; babel ./src --out-dir ./build; ./bin/mocha --compilers js:babel-core/register --require jsdom-global/register; npm run --silent sound:plock"",
    "stats": "./node_modules/.bin/webpack --env production --profile --json > webpack-build-stats.json"
  },
  "repository": {
    "type": "git",
    "url": "git@gitlab.gereon-reus.de:/l3pweb/pipeline"
  },
  "author": "",
  "license": "UNLICENSED",
  "devDependencies": {
    "@types/jquery": "*",
    "awesome-typescript-loader": "*",
    "babel-core": "*",
    "babel-eslint": "*",
    "babel-plugin-transform-object-rest-spread": "*",
    "babel-preset-env": "*",
    "babel-preset-es2015": "*",
    "babel-preset-flow": "*",
    "babel-preset-react": "*",
    "browser-sync": "*",
    "browser-sync-webpack-plugin": "*",
    "copy-webpack-plugin": "*",
    "css-loader": "*",
    "eslint": "*",
    "eslint-loader": "*",
    "eslint-plugin-flowtype": "*",
    "extract-text-webpack-plugin": "*",
    "file-loader": "*",
    "google-fonts-webpack-plugin": "*",
    "html-webpack-plugin": "*",
    "jsdom": "*",
    "jsdom-quokka-plugin": "*",
    "json-loader": "*",
    "less": "*",
    "less-loader": "*",
    "node-sass": "*",
    "nodemon": "*",
    "sass-loader": "*",
    "style-loader": "*",
    "svg-loader": "*",
    "trash-cli": "*",
    "ts-loader": "*",
    "ts-node": "*",
    "tslint": "*",
    "tslint-eslint-rules": "*",
    "typescript": "*",
    "url-loader": "*",
    "webpack": "^3.8.1",
    "webpack-bundle-analyzer": "*",
    "webpack-config": "*",
    "webpack-merge": "*"
  },
  "dependencies": {
    "@cartok/dagre-d3": "^0.4.52",
    "@cartok/hierarchy-select": "^1.0.0",
    "babel-polyfill": "^6.23.0",
    "d3": "^3.5.17",
    "datatables.net": "^1.10.15",
    "datatables.net-bs": "^1.10.15",
    "datatables.net-buttons": "^1.4.0",
    "datatables.net-buttons-bs": "^1.4.0",
    "datatables.net-colreorder": "^1.3.3",
    "datatables.net-colreorder-bs": "^1.3.3",
    "datatables.net-fixedheader": "^3.1.2",
    "datatables.net-fixedheader-bs": "^3.1.2",
    "datatables.net-keytable": "^2.2.1",
    "datatables.net-keytable-bs": "^2.2.1",
    "datatables.net-responsive": "^2.1.1",
    "datatables.net-responsive-bs": "^2.1.1",
    "datatables.net-scroller": "^1.4.2",
    "datatables.net-scroller-bs": "^1.4.2",
    "datatables.net-select": "^1.2.2",
    "datatables.net-select-bs": "^1.2.2",
    "dom-node-template": "^1.0.1",
    "jquery": "^3.2.1",
    "l3p-core": "^2.5.2",
    "list.js": "^1.5.0",
    "literal-observer": "^0.5.1",
    "lodash-es": "^4.17.4"
  },
  "quokka": {
    "babel": {
      "presets": [
        "env",
        "flow"
      ],
      "polyfill": true
    },
    "plugins": [
      "jsdom-quokka-plugin"
    ],
    "ts": true
  }
}
节点

项目中 webpack 的正确路径是./node_modules/.bin/wepback

在 npm 脚本中,您可以访问所有节点模块,就好像它们在 PATH 上一样,因此您需要这样做:

"dev":"clear; npm run --silent sound:trash; webpack --env development --watch; npm run --silent sound:microwave"

请注意,webpack 不需要在 package.json 中限定文件夹范围。

编辑:或者要使其与您的构建脚本保持一致:

"dev":"clear; npm run --silent sound:trash; ./node_modules/.bin/webpack --env development --watch; npm run --silent sound:microwave"

运行 package.json 中定义的 NPM 脚本时,不需要指定 .node_modules.bin 文件夹中可执行文件的相对路径。在您的情况下,这意味着替换以下任一项的所有匹配项:

./node_modules/.bin/webpack
./.bin/webpack

只需:

webpack

这将确保您的 NPM 脚本能够正确解析可执行文件。

最新更新