你好我正在學習Webpack我一直在關注一些教程,並且遇到了一些問題。我在本地安裝了webpack的文件夾,我正在使用npm install webpack --save-dev
。我做了兩個JS腳本,我想捆綁它們,並且我嘗試了WindowsPowerShell中的命令webpack script-1.js /.bundle.js
(我正在使用Windows 7)。現在,這由下面的錯誤Git Bash和webpack
的WebPack不被識別爲
於是我全局安裝的WebPack內部或外部的命令運行的程序或批處理文件,當我在PowerShell中所使用的相同的命令(我已經打開它作爲管理員),它使bundle.js文件,但不是在我工作的目錄中,但在C:
現在在這個失敗後,我決定嘗試使用git bash。首先,我已經試過這個命令webpack script-1.js /.bundle.js
並得到了以下錯誤
bash下的WebPack:找不到命令
最後經過一番努力,我能夠讓它工作在git的慶典node_modules/.bin/webpack ./script-1.js bundle.js
使用此命令
有沒有辦法解決這個問題,所以我可以只鍵入webpack而不是整個路徑?還有一種方法可以修復PowerShell中的路徑嗎?
這是我的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"
}
}
,這是的package.json位於node_modules /的WebPack /的package.json
{
"_args": [
[
{
"raw": "webpack",
"scope": null,
"escapedName": "webpack",
"name": "webpack",
"rawSpec": "",
"spec": "latest",
"type": "tag"
},
"C:\\Users\\Djole\\Desktop\\NetNinja\\webpack-playlist"
]
],
"_from": "[email protected]",
"_id": "[email protected]",
"_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": "[email protected]"
},
"_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, i.e. 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": "[email protected]"
},
{
"name": "sokra",
"email": "[email protected]"
},
{
"name": "thelarkinn",
"email": "[email protected]"
}
],
"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"
}
編輯: 我特地用以下解決方案結束時間: 將此項添加到您的package.json文件中
"scripts" : {
"build" : "webpack ./entry.js bundle.js"
}
然後鍵入npm run build
這仍然會運行本地版本,因爲npm將首先看./node_modules/.bin/
如果它在'node_modules/.bin'那麼這聽起來像是'webpack'在本地並沒有安裝全球。也許用'npm install -g webpack'再試一次? – Trott
@Trott首先,我在本地安裝它,但因爲它無法正常工作,我在全球範圍內安裝它。然後它在PowerShell中工作,但輸出是在C:不在我的工作文件夾,所以這就是爲什麼我嘗試git bash和本地工作,但我必須使用整個命令路徑,而不是隻使用webpack腳本 - 1.js/.bundle.js目前我已經在我正在使用的文件夾和全局文件夾中安裝了webpack。 – Zvezdas1989