webpack如何配置出入口?
七娃博客541人阅读
webpack是前端一款流行的打包插件,而且升级比较快,同时在面试的过程中也经常会遇到webpack的相关问题,今天就总结一下常问的问题之一,也是小白学习webpack的第一步:配置打包文件的出入口。
步骤
1.新建build/webpack.common.js
2.在文件中配置入口
可配置多个入口。但开发中一般是react或vue,为单页面web应用(SPA),入口一个即可。
const path = require('path') module.exports = { entry: path.resolve(__dirname, "../src/main.js"), }
3.在文件中配置出口
只能有一个出口,这里指定输出路径为'dist'
module.exports = { output: { path:path.resolve(__dirname,'../dist'), filename: '[name].bundle.js', clean:true //每次构建清除dist包 }, }
4.在package.json文件中,我们创建一个运行webpack命令构建脚本
"scripts": { "build":"webpack --config build/webpack.common.js", }
5.运行打包命令,就会在dist文件生成main.bundle.js文件了
npm run build
评论 | 0 条评论
登录之后才可留言,前往登录