我想开始使用webpack。我输入这个命令
npm run dev
在我的项目所在的命令shell中以及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的文件。有人能帮助我吗?我是stackoverflow的新手,也是使用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
}
}
答案 0 :(得分:2)
节点项目中webpack的正确路径为BigInteger
在npm脚本中,您可以访问所有节点模块,就好像它们在PATH上一样,所以您需要这样:
./node_modules/.bin/wepback
请注意,webpack不需要package.json
中的文件夹范围编辑: 或者使其与构建脚本保持一致:
"dev":"clear; npm run --silent sound:trash; webpack --env development --watch; npm run --silent sound:microwave"
答案 1 :(得分:1)
运行package.json
中定义的NPM脚本时,无需在.\node_modules\.bin
文件夹中指定可执行文件的相对路径。在您的情况下,这意味着替换所有出现的:
./node_modules/.bin/webpack
./.bin/webpack
只有:
webpack
这将确保您的NPM脚本能够正确解析可执行文件。