Skip to content

Instantly share code, notes, and snippets.

@firenz
Created July 14, 2020 22:06
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save firenz/7e940f5f2f8fd46fd6a54e4d2a2ddc5b to your computer and use it in GitHub Desktop.
Save firenz/7e940f5f2f8fd46fd6a54e4d2a2ddc5b to your computer and use it in GitHub Desktop.
Webpack production mode doesn't work
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CheckerPlugin } = require('awesome-typescript-loader');
const path = require("path");
const basePath = __dirname;
module.exports = {
context: path.join(basePath, 'src'),
resolve: {
alias: {
common: path.resolve(__dirname, './src/common'),
core: path.resolve(__dirname, './src/core'),
router: path.resolve(__dirname, './src/router'),
pods: path.resolve(__dirname, './src/pods'),
layouts: path.resolve(__dirname, './src/layouts'),
pages: path.resolve(__dirname, './src/pages'),
img: path.resolve(__dirname, './src/img'),
},
extensions: ['.js', '.ts', '.jsx', '.tsx'],
},
entry: {
app: ['regenerator-runtime/runtime', './main.tsx'],
},
optimization: {
splitChunks: {
cacheGroups: {
vendor: {
chunks: 'all',
name: 'vendor',
test: /[\\/]node_modules[\\/]/,
enforce: true,
},
},
},
},
output: {
path: path.resolve(__dirname, 'dist/js'),
filename: './js/[name].[chunkhash].js',
},
module: {
rules: [
{
test: /\.(tsx?)$/,
exclude: /node_modules/,
loader: 'awesome-typescript-loader',
options: {
useBabel: true,
useCache: true,
babelCore: '@babel/core',
},
},
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.html$/,
loader: 'html-loader',
},
],
},
plugins: [
new HtmlWebpackPlugin({
filename: 'index.html',
template: './index.html',
}),
new CheckerPlugin(),
],
};
const { merge } = require("webpack-merge");
const base = require("./base.webpack.config");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
module.exports = merge(base, {
mode: 'production',
output: {
publicPath: '/',
filename: '[name].[chunkhash].js',
},
module: {
rules: [
{
test: /\.scss$/,
exclude: /node_modules/,
use: [
MiniCssExtractPlugin.loader,
{
loader: "css-loader",
options: {
modules: {
localIdentName: "[hash:base64]"
},
localsConvention: "camelCase"
}
}
]
},
{
test: /\.css$/,
use: [MiniCssExtractPlugin.loader, "css-loader"]
},
{
test: /\.(png|jpe?g|gif)$/,
exclude: /node_modules/,
use: {
loader: "url-loader",
options: {
limit: 10 * 1024,
name: "./img/[name].[hash].[ext]"
}
}
}
]
},
plugins: [
new MiniCssExtractPlugin({
filename: "./css/[name].[chunkhash].css",
chunkFilename: "[id].css"
})
]
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment