webpack安装配置
1.先在cmd检查 node -v 还有 npm -v 是否输出版本号
2.新建一个项目输入 mkdir app
本文项目位置 C:\Users\SEELE\Desktop\app
3.全局安装:输入npm install webpack -g 回车
4.生成配置文件 npm init (开始配置的文件过程如下:出现之后只要回车即可)
检查目录有没package.json
5.安装webpack依赖:在cmd输入:npm install webpack --save-dev 回车
6.修改package.json中的scripts
"scripts": {
"build": "webpack "
},
7.新建webpack.config.js 输入以下内容
module.exports = {
entry: __dirname + "/index.js",//已多次提及的唯一入口文件
output: {
path: __dirname + "/public",//打包后的文件存放的地方
filename: "bundle.js"//打包后输出文件的文件名
}
}
8.在根目录新建 index.js ,内容自定义
9.npm run build
10.检查项目中是否导出 public/bundle.js
11. 添加css loader ,打包css 文件 。npm install --save-dev style-loader css-loader
12.修改成一下内容
module.exports = {
entry: __dirname + "/index.js",//已多次提及的唯一入口文件
output: {
path: __dirname + "/public",//打包后的文件存放的地方
filename: "bundle.js"//打包后输出文件的文件名
},
module: {
rules: [
{
test: /\.css$/,
use: [ 'style-loader', 'css-loader' ]
}
]
}
}
posted on 2018-02-28 16:13 orangeGame 阅读(208) 评论(0) 编辑 收藏 举报