1.webpack配置webpack的一般配置如下(entry,output,loader,plugin,mode)constpath=require('path')constHtmlWebpaackPlugin=require('html-webpack-plugin')//初始化HTML模板const{CleanWebpackPlugin}=require('clean-webpack-plugin')//每次打包时删除旧文件module.exports={entry:'./src/main.ts',output:{path:path.resolve(__dirname,'dist'),filename:'main.js'},//开发模式服务器devServer:{static:{directory:path.join(__dirname,'dist')},open:true},//配置默认后缀resolve:{extensions:['.ts','.js','.json','.svg']},module:{//css和ts的加载器规则:[{test:/\.css$/,使用:['style-loader','css-loader']},{test:/\.ts$/,使用:['ts-loader'],排除:/node_modules/}]},插件:[//相关插件newHtmlWebpaackPlugin({template:'./src/index.html'}),newCleanWebpackPlugin()],//开发模式mode:'development'}SourceMap是映射重关系，在项目运行的时候，如果出现错误，我们可以使用SourceMap反向定位到源代码位置；config//开发环境sourcemap不包含列信息。when(process.env.NODE_ENV==='development',(config)=>config.devtool('cheap-source-map'))//预览环境buildvue-loaderaddfilename.when(process.env.VUE_APP_SCOURCE_LINK==='TRUE',(config)=>VueFilenameInjector(config,{propName:process.env.VUE_APP_SOURCE_VIEWER_PROP_NAME}))
