75 lines
2.4 KiB
TypeScript
75 lines
2.4 KiB
TypeScript
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"),
|
||
},
|
||
// fallback: {
|
||
// crypto: require.resolve('crypto-browserify'),
|
||
// buffer: require.resolve("buffer/"),
|
||
// http: require.resolve("stream-http"),
|
||
// },
|
||
},
|
||
// 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;
|