hello guys i'm trying learn webpack i've been following tutorials , i've run problems. i've installed webpack locally in folder working in npm install webpack --save-dev. made 2 js scripts , wanted bundle them , i've tried following command webpack script-1.js /.bundle.js in windowspowershell (i'm using windows 7). made following error
webpack not recognized internal or external command operable program or batch file
so installed webpack globally, , when used same command in powershell (i have opened admin), made bundle.js file not in directory working in, in c:
after failure i've decided try using git bash. first i've tried command webpack script-1.js /.bundle.js , got following error
bash: webpack: command not found
finally after trying able make work using command in git bash node_modules/.bin/webpack ./script-1.js bundle.js
there way fix this, can type webpack instead of whole path ? there way fix path in powershell ?
this mine 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" } } and package.json located in 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": "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": "tobias.koppers@googlemail.com" }, "_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 browser. allows split codebase multiple bundles, can loaded on demand. support loaders preprocess files, i.e. json, jsx, es7, css, less, ... , 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": "mail@johannesewald.de" }, { "name": "sokra", "email": "tobias.koppers@googlemail.com" }, { "name": "thelarkinn", "email": "sean.larkin@cuw.edu" } ], "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" } edit: i've come following solution in end: add package.json file
"scripts" : { "build" : "webpack ./entry.js bundle.js" } and type npm run build still run local version because npm first in ./node_modules/.bin/
that kind of path used in git windows bash.
see this issue
we use cmdr (http://cmder.net/ ) emulate console on windows machines.
still had modify scripts , separate build clean , build tasks working.
"scripts": { "clean": "rm -rf dist", "build": "node_modules/.bin/babel-node -- ./node_modules/webpack/bin/webpack.js --stats --config ./webpack/prod.config.js", ... }, you can see similar instruction in this project 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", 
Comments
Post a Comment