webpack配置ts

参考

const {CleanWebpackPlugin} &＃61; require(&＃39;clean-webpack-plugin&＃39;)
const HtmlWebpackPlugin &＃61; require(&＃39;html-webpack-plugin&＃39;)
const path &＃61; require(&＃39;path&＃39;)const isProd &＃61; process.env.NODE_ENV &＃61;&＃61;&＃61; &＃39;production&＃39; // 是否生产环境function resolve (dir) {return path.resolve(__dirname, &＃39;..&＃39;, dir)
}module.exports &＃61; {mode: isProd ? &＃39;production&＃39; : &＃39;development&＃39;,entry: {app: &＃39;./src/main.ts&＃39;},output: {path: resolve(&＃39;dist&＃39;),filename: &＃39;[name].[contenthash:8].js&＃39;},module: {rules: [{test: /\.tsx?$/,use: &＃39;ts-loader&＃39;,include: [resolve(&＃39;src&＃39;)]}]},plugins: [new CleanWebpackPlugin({}),new HtmlWebpackPlugin({template: &＃39;./public/index.html&＃39;})],resolve: {extensions: [&＃39;.ts&＃39;, &＃39;.tsx&＃39;, &＃39;.js&＃39;]},devtool: isProd ? &＃39;cheap-module-source-map&＃39; : &＃39;cheap-module-eval-source-map&＃39;,devServer: {host: &＃39;localhost&＃39;, // 主机名stats: &＃39;errors-only&＃39;, // 打包日志输出输出错误信息port: 8081,open: true//是否打开浏览器},
}


在package.json中

"dev": "cross-env NODE_ENV&＃61;development webpack-dev-server --config build/webpack.config.js",
"build": "cross-env NODE_ENV&＃61;production webpack --config build/webpack.config.js"