Git Bash和webpack

你好，我正在试图学习Webpack我一直在一些教程，我遇到了一些问题。 我在本地安装了webpack文件夹，我正在使用npm install webpack --save-dev 。 我做了两个JS脚本，我想捆绑他们，我已经尝试在WindowsPowerShell（我正在使用Windows 7）下面的命令webpack script-1.js /.bundle.js 。 现在这造成了以下错误

webpack不被识别为内部或外部命令可操作的程序或batch file

所以我安装了全球的webpack，当我在PowerShell中使用相同的命令（我已经打开它作为pipe理员），它使bundle.js文件，但不是在我工作的目录，但在C：
现在这个失败后，我决定尝试使用git bash。 首先我试过这个命令的webpack script-1.js /.bundle.js并得到以下错误

bash：webpack：找不到命令

最后经过一番尝试后，我能够使用git bash中的这个命令工作node_modules/.bin/webpack ./script-1.js bundle.js
有没有办法解决这个问题，所以我可以只键入webpack而不是整个path？ 还有一种方法可以修复PowerShell中的path？

这是我的package.json

 { "name": "webpack-playlist", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "repository": { "type": "git", "url": "git+https://github.com/iamshaunjp/webpack-playlist.git" }, "author": "me", "license": "MIT", "bugs": { "url": "https://github.com/iamshaunjp/webpack-playlist/issues" }, "homepage": "https://github.com/iamshaunjp/webpack-playlist#readme", "devDependencies": { "webpack": "^2.3.3" } } 

这是位于node_modules / webpack / package.json中的package.json

 { "_args": [ [ { "raw": "webpack", "scope": null, "escapedName": "webpack", "name": "webpack", "rawSpec": "", "spec": "latest", "type": "tag" }, "C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist" ] ], "_from": "webpack@latest", "_id": "webpack@2.3.3", "_inCache": true, "_location": "/webpack", "_nodeVersion": "7.4.0", "_npmOperationalInternal": { "host": "packages-12-west.internal.npmjs.com", "tmp": "tmp/webpack-2.3.3.tgz_1491205859622_0.6350918470416218" }, "_npmUser": { "name": "sokra", "email": "[e-mail]" }, "_npmVersion": "4.0.5", "_phantomChildren": {}, "_requested": { "raw": "webpack", "scope": null, "escapedName": "webpack", "name": "webpack", "rawSpec": "", "spec": "latest", "type": "tag" }, "_requiredBy": [ "#DEV:/", "#USER" ], "_resolved": "https://registry.npmjs.org/webpack/-/webpack-2.3.3.tgz", "_shasum": "eecc083c18fb7bf958ea4f40b57a6640c5a0cc78", "_shrinkwrap": null, "_spec": "webpack", "_where": "C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist", "author": { "name": "Tobias Koppers @sokra" }, "bin": { "webpack": "./bin/webpack.js" }, "bugs": { "url": "https://github.com/webpack/webpack/issues" }, "dependencies": { "acorn": "^4.0.4", "acorn-dynamic-import": "^2.0.0", "ajv": "^4.7.0", "ajv-keywords": "^1.1.1", "async": "^2.1.2", "enhanced-resolve": "^3.0.0", "interpret": "^1.0.0", "json-loader": "^0.5.4", "loader-runner": "^2.3.0", "loader-utils": "^0.2.16", "memory-fs": "~0.4.1", "mkdirp": "~0.5.0", "node-libs-browser": "^2.0.0", "source-map": "^0.5.3", "supports-color": "^3.1.0", "tapable": "~0.2.5", "uglify-js": "^2.8.5", "watchpack": "^1.3.1", "webpack-sources": "^0.2.3", "yargs": "^6.0.0" }, "description": "Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, ie json, jsx, es7, css, less, ... and your custom stuff.", "devDependencies": { "beautify-lint": "^1.0.3", "benchmark": "^2.1.1", "bundle-loader": "~0.5.0", "codacy-coverage": "^2.0.1", "codecov.io": "^0.1.2", "coffee-loader": "~0.7.1", "coffee-script": "^1.10.0", "coveralls": "^2.11.2", "css-loader": "~0.25.0", "es6-promise-polyfill": "^1.1.1", "eslint": "3.12.2", "eslint-plugin-node": "^3.0.5", "express": "~4.13.1", "extract-text-webpack-plugin": "^2.0.0-beta", "file-loader": "~0.9.0", "i18n-webpack-plugin": "^0.3.0", "istanbul": "^0.4.5", "jade": "^1.11.0", "jade-loader": "~0.8.0", "js-beautify": "^1.5.10", "less": "^2.5.1", "less-loader": "^2.0.0", "lodash": "^4.17.4", "mocha": "^3.2.0", "mocha-lcov-reporter": "^1.0.0", "nsp": "^2.6.1", "raw-loader": "~0.5.0", "react": "^15.2.1", "react-dom": "^15.2.1", "script-loader": "~0.7.0", "should": "^11.1.1", "simple-git": "^1.65.0", "sinon": "^1.17.7", "style-loader": "~0.13.0", "url-loader": "~0.5.0", "val-loader": "~0.5.0", "vm-browserify": "~0.0.0", "webpack-dev-middleware": "^1.9.0", "worker-loader": "~0.7.0" }, "directories": {}, "dist": { "shasum": "eecc083c18fb7bf958ea4f40b57a6640c5a0cc78", "tarball": "https://registry.npmjs.org/webpack/-/webpack-2.3.3.tgz" }, "engines": { "node": ">=4.3.0 <5.0.0 || >=5.10" }, "files": [ "lib/", "bin/", "buildin/", "hot/", "web_modules/", "schemas/" ], "gitHead": "ba24c1b163dc038ed738eb4a57dcb241bf63146d", "homepage": "https://github.com/webpack/webpack", "license": "MIT", "main": "lib/webpack.js", "maintainers": [ { "name": "jhnns", "email": "[e-mail]" }, { "name": "sokra", "email": "[e-mail]" }, { "name": "thelarkinn", "email": "[e-mail]" } ], "name": "webpack", "optionalDependencies": {}, "readme": "ERROR: No README data found!", "repository": { "type": "git", "url": "git+https://github.com/webpack/webpack.git" }, "scripts": { "appveyor:benchmark": "npm run benchmark", "appveyor:test": "node --max_old_space_size=4096 node_modules\\mocha\\bin\\mocha --harmony test/*.test.js", "beautify-lint": "beautify-lint 'lib/**/*.js' 'hot/**/*.js' 'bin/**/*.js' 'benchmark/*.js' 'test/*.js'", "benchmark": "mocha test/*.benchmark.js --harmony -R spec", "build:examples": "cd examples && node buildAll.js", "cover": "node --harmony ./node_modules/istanbul/lib/cli.js cover -x '**/*.runtime.js' node_modules/mocha/bin/_mocha -- test/*.test.js", "cover:min": "node --harmony ./node_modules/.bin/istanbul cover -x '**/*.runtime.js' --report lcovonly node_modules/mocha/bin/_mocha -- test/*.test.js", "lint": "eslint lib bin hot buildin test/**/webpack.config.js test/binCases/**/test.js examples/**/webpack.config.js", "lint-files": "npm run lint && npm run beautify-lint", "nsp": "nsp check --output summary", "pretest": "npm run lint-files", "publish-patch": "npm run lint && npm run beautify-lint && mocha && npm version patch && git push && git push --tags && npm publish", "test": "mocha test/*.test.js --harmony --check-leaks", "travis:benchmark": "npm run benchmark", "travis:lint": "npm run lint-files && npm run nsp", "travis:test": "npm run cover:min" }, "version": "2.3.3", "web": "lib/webpack.web.js" } 

编辑：我最终得到了以下解决scheme：添加到您的package.json文件

  "scripts" : { "build" : "webpack ./entry.js bundle.js" } 

然后键入npm run build这将仍然运行本地版本，因为npm将首先查找./node_modules/.bin/

Answer 1

这种path是在Windows bash的git中使用的。
看到这个问题

我们使用cmdr（ http://cmder.net/ ）来模拟Windows机器上的控制台。
尽pipe如此，我们仍然需要修改脚本和独立的构build来清理和构build任务来使其工作。

 "scripts": { "clean": "rm -rf dist", "build": "node_modules/.bin/babel-node -- ./node_modules/webpack/bin/webpack.js --stats --config ./webpack/prod.config.js", ... }, 

你可以在这个项目package.json看到类似的指令：

 "build-main": "cross-env NODE_ENV=production node -r babel-register ./node_modules/webpack/bin/webpack --config webpack.config.electron.js --progress --profile --colors",