webpack npm start命令使用中的坑
我的webpack安装在:F:\mywebpack
1.不采用配置文件打包时,所有操作采用默认形式。
配置文件package.json 内容为:
{
"name": "mywebpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^1.13.2",
"webpack-cli": "^3.0.8"
}
}
打包命令为:node_modules\.bin\webpack app/main.js public/bundle.js
2.在采用webpack.config.js 配置文件进行打包时的基础配置为:
在webpack根目录下,创建webpack.config.js
内容为:
module.exports = {
entry: _dirname + "/app/main.js",
output:{
path: _dirname+"/build",
filename: "bundle.js"
}
}
配置文件package.json 内容为:
{
"name": "mywebpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^1.13.2",
"webpack-cli": "^3.0.8"
}
}
此时需要命令行node_modules\.bin\webpack进行打包。
此时命令稍显复杂,为此经过下面的更改,采用npm start命令可实现打包;
配置文件package.json 内容为:
{
"name": "mywebpack",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"start": "webpack"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^1.13.2",
"webpack-cli": "^3.0.8"
}
}
webpack.config.js
内容为:
module.exports = {
entry: _dirname + "/app/main.js", 唯一的入口文件
output:{
path: _dirname+"/build", 打包后的文件存放的位置
filename: "bundle.js" 打包后输出的文件名
}
}
此时报错:
经过分析,为配置文件package.json 格式不对,此处少了一个逗号,补充后如下:
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "webpack"
},
最终的目录结构为:
实例代码: