webpack-图片与css处理

155 阅读1分钟

webpack的安装 npm install webpack webpack-cli -g (npm init -y) entry/output/mode

externals:{ jquery:"jQuery" } 外部导入 不引入不必要的打包

css-loader style-loader module->rules->test/loaders->style-loader!css-loader file-loader 图片处理 option->outputPath:"images/"//name:"[name]_[hash:5].[ext]"//处理图片的路径与名字(配置项option)

npm install node-sass sass-loader -D loader:"style-loader!css-loader!sass-loader" npm install less less-loader -D

webpack打包ES6的代码
class中使用初始值
decorator 装饰器
generator 生成器
async await

babel插件可以把上面的内容进行转换 babel-loader npm install @babel/core babel/core babel-loader -D npm install @bebel/plugin-proposal-class-properties -D src中创建.babelrc文件->创建对象{plugins:[ [ "@babel/plugin-proposal-class-properties",{"loose":true}] ]}