monorepo-microservice-rbac/apps/aorta/scripts/webpack.common.ts

70 lines
2.3 KiB
TypeScript
Raw Permalink Normal View History

2023-08-27 14:37:59 +08:00
import { Configuration, DefinePlugin } from "webpack";
import HtmlWebpackPlugin from "html-webpack-plugin";
import path from "path";
import * as dotenv from "dotenv";
import fontsLoader from "./loaders/fonts.loader";
import jsonLoader from "./loaders/json.loader";
import imgLoader from "./loaders/img.loader";
import babelLoader from "./loaders/babel.loader";
import { cssLoader, lessLoader } from "./loaders/style.loader";
// 加载配置文件
const envConfig = dotenv.config({
path: path.resolve(__dirname, "../env/.env." + process.env.BASE_ENV),
});
const baseConfig: Configuration = {
entry: path.join(__dirname, "../src/index.tsx"), // 入口文件
// 打包出口文件
output: {
filename: "static/js/[name].[chunkhash:8].js", // 每个输出js的名称
path: path.join(__dirname, "../dist"), // 打包结果输出路径
clean: true, // webpack4需要配置clean-webpack-plugin来删除dist文件,webpack5内置了
publicPath: "/", // 打包后文件的公共前缀路径
},
// loader 配置
module: {
rules: [
babelLoader,
cssLoader,
lessLoader,
jsonLoader,
imgLoader,
fontsLoader,
],
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".jsx"],
// 别名需要配置两个地方,这里和 tsconfig.json
alias: {
"@": path.join(__dirname, "../src"),
"@@": path.join(__dirname, "../core"),
},
},
// plugins
plugins: [
new HtmlWebpackPlugin({
// 复制 'index.html' 文件并自动引入打包输出的所有资源js/css
template: path.join(__dirname, "../public/index.html"),
inject: true, // 自动注入静态资源
hash: true,
cache: false,
// 压缩html资源
minify: {
removeAttributeQuotes: true,
collapseWhitespace: true, //去空格
removeComments: true, // 去注释
minifyJS: true, // 在脚本元素和事件属性中缩小JavaScript(使用UglifyJS)
minifyCSS: true, // 缩小CSS样式元素和样式属性
},
}),
new DefinePlugin({
"process.env": JSON.stringify(envConfig.parsed),
"process.env.BASE_ENV": JSON.stringify(process.env.BASE_ENV),
"process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV),
}),
],
};
export default baseConfig;