ant-design-vue/antd-tools/getWebpackConfig.js

283 lines
6.8 KiB
JavaScript
Raw Normal View History

2021-08-26 01:37:19 +00:00
const { getProjectPath, resolve } = require('./utils/projectHelper');
2019-01-12 03:33:27 +00:00
const path = require('path');
const webpack = require('webpack');
const WebpackBar = require('webpackbar');
2021-04-09 03:00:41 +00:00
const { merge } = require('webpack-merge');
2021-05-12 06:32:20 +00:00
const TerserPlugin = require('terser-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
2021-05-12 06:32:20 +00:00
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
2019-01-12 03:33:27 +00:00
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
const CleanUpStatsPlugin = require('./utils/CleanUpStatsPlugin');
2020-08-14 14:58:13 +00:00
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
2019-01-12 03:33:27 +00:00
const distFileBaseName = 'antd';
const svgRegex = /\.svg(\?v=\d+\.\d+\.\d+)?$/;
const svgOptions = {
limit: 10000,
minetype: 'image/svg+xml',
};
const imageOptions = {
limit: 10000,
};
function getWebpackConfig(modules) {
2020-10-19 08:43:10 +00:00
const pkg = require(getProjectPath('package.json'));
2019-01-12 03:33:27 +00:00
const babelConfig = require('./getBabelCommonConfig')(modules || false);
2018-03-18 11:59:38 +00:00
2020-08-14 14:58:13 +00:00
const pluginImportOptions = {
style: true,
libraryName: distFileBaseName,
libraryDirectory: 'components',
};
2020-10-19 08:43:10 +00:00
babelConfig.plugins.push([resolve('babel-plugin-import'), pluginImportOptions]);
2018-03-18 11:59:38 +00:00
if (modules === false) {
babelConfig.plugins.push(require.resolve('./replaceLib'));
}
2021-04-09 03:00:41 +00:00
/** @type {import('webpack').Configuration} */
2018-03-18 11:59:38 +00:00
const config = {
devtool: 'source-map',
output: {
2020-10-19 08:43:10 +00:00
path: getProjectPath('./dist/'),
2018-03-18 11:59:38 +00:00
filename: '[name].js',
},
resolve: {
2019-01-12 03:33:27 +00:00
modules: ['node_modules', path.join(__dirname, '../node_modules')],
2020-10-19 08:43:10 +00:00
extensions: [
'.web.tsx',
'.web.ts',
'.web.jsx',
'.web.js',
'.ts',
'.tsx',
'.js',
'.jsx',
'.vue',
'.md',
'.json',
],
2018-03-18 11:59:38 +00:00
alias: {
'@': process.cwd(),
},
2021-04-09 03:00:41 +00:00
fallback: [
'child_process',
'cluster',
'dgram',
'dns',
'fs',
'module',
'net',
'readline',
'repl',
'tls',
].reduce((acc, name) => Object.assign({}, acc, { [name]: false }), {}),
2018-03-18 11:59:38 +00:00
},
module: {
rules: [
{
test: /\.vue$/,
exclude: /node_modules/,
use: [
{
loader: 'vue-loader',
2018-03-19 13:23:38 +00:00
options: {
loaders: {
js: [
{
loader: 'babel-loader',
2018-03-19 13:23:38 +00:00
options: {
2020-10-19 08:43:10 +00:00
presets: [resolve('@babel/preset-env')],
2020-08-11 11:56:28 +00:00
plugins: [
[
resolve('@vue/babel-plugin-jsx'),
{ mergeProps: false, enableObjectSlots: false },
],
2020-10-19 08:43:10 +00:00
resolve('@babel/plugin-proposal-object-rest-spread'),
2020-08-11 11:56:28 +00:00
],
},
},
2018-03-19 13:23:38 +00:00
],
},
},
2018-03-18 11:59:38 +00:00
},
],
2019-01-12 03:33:27 +00:00
},
{
2018-03-19 13:23:38 +00:00
test: /\.(js|jsx)$/,
loader: 'babel-loader',
exclude: /node_modules/,
2018-03-19 13:23:38 +00:00
options: babelConfig,
2019-01-12 03:33:27 +00:00
},
2020-10-19 08:43:10 +00:00
{
test: /\.tsx?$/,
use: [
{
loader: 'babel-loader',
options: babelConfig,
},
{
loader: 'ts-loader',
},
],
},
2019-01-12 03:33:27 +00:00
{
2018-03-18 11:59:38 +00:00
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: {
sourceMap: true,
2018-03-18 11:59:38 +00:00
},
},
{
loader: 'postcss-loader',
2021-04-25 15:34:42 +00:00
options: {
postcssOptions: {
plugins: ['autoprefixer'],
},
sourceMap: true,
},
},
],
2019-01-12 03:33:27 +00:00
},
{
2018-03-18 11:59:38 +00:00
test: /\.less$/,
use: [
MiniCssExtractPlugin.loader,
{
loader: 'css-loader',
options: {
sourceMap: true,
2019-01-12 03:33:27 +00:00
},
},
{
loader: 'postcss-loader',
2021-04-25 15:34:42 +00:00
options: {
postcssOptions: {
plugins: ['autoprefixer'],
},
sourceMap: true,
},
},
{
loader: 'less-loader',
options: {
2020-05-09 02:02:33 +00:00
lessOptions: {
sourceMap: true,
javascriptEnabled: true,
},
2018-03-18 11:59:38 +00:00
},
},
],
},
// Images
{
test: svgRegex,
loader: 'url-loader',
options: svgOptions,
},
{
test: /\.(png|jpg|jpeg|gif)(\?v=\d+\.\d+\.\d+)?$/i,
loader: 'url-loader',
options: imageOptions,
2018-03-18 11:59:38 +00:00
},
],
},
plugins: [
2020-08-14 14:58:13 +00:00
// new BundleAnalyzerPlugin(),
2018-03-18 11:59:38 +00:00
new CaseSensitivePathsPlugin(),
new webpack.BannerPlugin(`
${pkg.name} v${pkg.version}
2018-03-18 11:59:38 +00:00
Copyright 2017-present, ant-design-vue.
2018-03-18 11:59:38 +00:00
All rights reserved.
`),
new WebpackBar({
name: '🚚 Ant Design Vue Tools',
color: '#2f54eb',
2018-03-18 11:59:38 +00:00
}),
new CleanUpStatsPlugin(),
2018-03-18 11:59:38 +00:00
],
2021-05-12 06:32:20 +00:00
performance: {
hints: false,
},
2019-01-12 03:33:27 +00:00
};
2018-03-18 11:59:38 +00:00
if (process.env.RUN_ENV === 'PRODUCTION') {
2019-01-12 03:33:27 +00:00
const entry = ['./index'];
2018-03-18 11:59:38 +00:00
config.externals = {
vue: {
root: 'Vue',
commonjs2: 'vue',
commonjs: 'vue',
amd: 'vue',
},
2019-01-12 03:33:27 +00:00
};
config.output.library = distFileBaseName;
config.output.libraryTarget = 'umd';
config.optimization = {
minimizer: [
2021-05-12 06:32:20 +00:00
new TerserPlugin({
parallel: true,
terserOptions: {
warnings: false,
},
}),
],
2019-01-12 03:33:27 +00:00
};
2018-03-18 11:59:38 +00:00
// Development
2021-04-09 03:00:41 +00:00
const uncompressedConfig = merge({}, config, {
entry: {
[distFileBaseName]: entry,
},
mode: 'development',
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css',
}),
],
});
2018-03-18 11:59:38 +00:00
// Production
2021-04-09 03:00:41 +00:00
const prodConfig = merge({}, config, {
entry: {
[`${distFileBaseName}.min`]: entry,
},
mode: 'production',
plugins: [
new webpack.optimize.ModuleConcatenationPlugin(),
new webpack.LoaderOptionsPlugin({
minimize: true,
}),
new MiniCssExtractPlugin({
filename: '[name].css',
}),
],
optimization: {
2021-05-12 06:32:20 +00:00
minimize: true,
minimizer: [new CssMinimizerPlugin({})],
},
});
return [prodConfig, uncompressedConfig];
2018-03-18 11:59:38 +00:00
}
2019-01-12 03:33:27 +00:00
return config;
}
2020-10-19 08:43:10 +00:00
getWebpackConfig.webpack = webpack;
getWebpackConfig.svgRegex = svgRegex;
getWebpackConfig.svgOptions = svgOptions;
getWebpackConfig.imageOptions = imageOptions;
module.exports = getWebpackConfig;