什么是webpack?
文件打包工具
我这就以打包使用scss为例了哈:
具体步骤:
1。先要创建package.json;
npm init -y
2.全局安装webpack
npm i -g webpack
4.局部安装webpack
npm i webpack -S
3.安装webpack-cli
npm i webpack-cli
4.安装各需要用到的loader
npm i style-loader css-loader sass-loader -D
npm i node-sass -S
5.然后创建一个webpack.config.js,配置:
在webpack.config.js里面配置去:
module.exports={
watch:true,
mode:'development',//解除警告,不写也不算错
entry : './src/main.js', //打包谁
output:'./src/dist.js', //打包到哪
module:{
rules:[
{
test:'/\.css$/'
use:[
'style-loader',
'css-loader'
]
},
{
test:'/\.scss$/',
use:[
'style-loader',
'css-loader',
'sass-loader'
]
}
]
}
}
附一张图:
配置package.json文件的这一项:
"scripts":{
"build" : "webpack"
}
将.scss文件 引入main.js文件
import './style.scss'
最后执行npm run build
就ok啦。。好啦其实挺简单的。嘿嘿