71 lines
2.4 KiB
JavaScript
71 lines
2.4 KiB
JavaScript
const path = require("path")
|
|
const HtmlWebpackPlugin = require("html-webpack-plugin")
|
|
const MiniCssExtractPlugin = require("mini-css-extract-plugin")
|
|
const TsconfigPathsPlugin = require("tsconfig-paths-webpack-plugin")
|
|
|
|
module.exports = (env, argv) => {
|
|
const devMode = argv.mode !== 'production'
|
|
|
|
return {
|
|
mode: devMode ? "development" : "production",
|
|
entry: {
|
|
bundle: path.resolve(__dirname, "src", "index.tsx")
|
|
},
|
|
output: {
|
|
filename: "[name].[contenthash:10].js",
|
|
path: path.resolve(__dirname, "dist"),
|
|
clean: true
|
|
},
|
|
module: {
|
|
rules: [
|
|
{
|
|
test: /\.tsx?/,
|
|
use: 'ts-loader',
|
|
exclude: /node_modules/
|
|
},
|
|
{
|
|
test: /\.jsx?$/,
|
|
include: path.resolve(__dirname, 'src'),
|
|
exclude: /node_modules/,
|
|
use: {
|
|
loader: 'babel-loader',
|
|
options: {
|
|
presets: [
|
|
['@babel/preset-env', { "targets": "defaults" }],
|
|
'@babel/preset-react'
|
|
]
|
|
}
|
|
}
|
|
},
|
|
{
|
|
test: /\.(sa|sc|c)ss$/,
|
|
use: [
|
|
// Creates `style` nodes from JS strings
|
|
devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
|
|
// Translates CSS into CommonJS
|
|
"css-loader",
|
|
// Compiles Sass to CSS
|
|
"sass-loader",
|
|
],
|
|
}
|
|
]
|
|
},
|
|
resolve: {
|
|
extensions: [".tsx", ".jsx", ".js"],
|
|
alias: {
|
|
"@mui/styles": path.resolve(__dirname, "node_modules", "@mui/styles"),
|
|
},
|
|
plugins: [new TsconfigPathsPlugin()]
|
|
},
|
|
plugins: [
|
|
new HtmlWebpackPlugin({
|
|
template: path.join(__dirname, "src", "html", "template.html"),
|
|
filename: "index.html",
|
|
title: "React with Webpack",
|
|
}),
|
|
].concat(devMode ? [] : [new MiniCssExtractPlugin({
|
|
filename: '[name].css',
|
|
chunkFilename: '[id].css'
|
|
})])
|
|
}
|
|
} |