const HtmlWebpackPlugin = require('html-webpack-plugin')
const webpack = require('webpack')
const path = require('path')
const { CleanWebpackPlugin } = require('clean-webpack-plugin')
const CopyPlugin = require('copy-webpack-plugin')
const dotenv = require('dotenv')
const dotenvConfig = dotenv && dotenv.config && dotenv.config()
const env = (dotenvConfig && dotenvConfig.parsed) || process.env
const envKeys = Object.keys(env).reduce((prev, next) => {
// eslint-disable-next-line no-param-reassign
prev[`process.env.${next}`] = JSON.stringify(env[next])
return prev
}, {})
module.exports = {
entry: './src/index.tsx',
output: {
filename: '[name].[hash].bundle.js',
chunkFilename: '[name].[hash].bundle.js',
path: path.resolve(__dirname, 'dist'),
publicPath: '/',
},
performance: { hints: false },
plugins: [
new webpack.DefinePlugin(envKeys),
new CleanWebpackPlugin(),
new CopyPlugin({ patterns: ['./public'] }),
new HtmlWebpackPlugin({ template: './public/index.html' }),
],
resolve: {
modules: [__dirname, 'src', 'node_modules'],
extensions: ['*', '.js', '.jsx', '.tsx', '.ts'],
alias: {
'@src': path.resolve(__dirname, 'src/'),
},
},
module: {
rules: [
{
test: /\.tsx?$/,
exclude: /node_modules/,
loader: require.resolve('babel-loader'),
},
{
test: /\.(png|jpe?g|svg|woff2?|ttf|eot)$/,
loader: 'url-loader',
options: {
limit: 8192,
name: './assets/[hash].[ext]',
},
},
],
},
optimization: {
splitChunks: {
cacheGroups: {
vendor: {
test: /node_modules/,
chunks: 'initial',
name: 'vendor',
enforce: true,
},
},
},
},
}