87 lines
2.5 KiB
JavaScript
87 lines
2.5 KiB
JavaScript
// Generated using webpack-cli https://github.com/webpack/webpack-cli
|
|
|
|
const path = require('path');
|
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
|
const isProduction = process.env.NODE_ENV == 'production';
|
|
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
|
const autoprefixer = require('autoprefixer')
|
|
|
|
const stylesHandler = isProduction ? MiniCssExtractPlugin.loader : 'style-loader';
|
|
|
|
const config = {
|
|
entry: './src/js/main.js',
|
|
output: {
|
|
filename: 'main.js',
|
|
path: path.resolve(__dirname, 'dist')
|
|
},
|
|
devServer: {
|
|
static: path.resolve(__dirname, 'dist'),
|
|
port: 5000,
|
|
hot: true
|
|
},
|
|
plugins: [
|
|
new HtmlWebpackPlugin({ template: './src/index.html' })
|
|
],
|
|
module: {
|
|
rules: [
|
|
{
|
|
test: /\.s[ac]ss$/i,
|
|
use: [
|
|
{
|
|
// Adds CSS to the DOM by injecting a `<style>` tag
|
|
loader: 'style-loader'
|
|
},
|
|
{
|
|
// Interprets `@import` and `url()` like `import/require()` and will resolve them
|
|
loader: 'css-loader'
|
|
},
|
|
{
|
|
// Loader for webpack to process CSS with PostCSS
|
|
loader: 'postcss-loader',
|
|
options: {
|
|
postcssOptions: {
|
|
plugins: [
|
|
autoprefixer
|
|
]
|
|
}
|
|
}
|
|
},
|
|
{
|
|
// Loads a SASS/SCSS file and compiles it to CSS
|
|
loader: 'sass-loader'
|
|
}
|
|
]
|
|
},
|
|
{
|
|
test: /\.css$/i,
|
|
use: [stylesHandler, 'css-loader', 'postcss-loader'],
|
|
},
|
|
{
|
|
test: /\.(js|jsx)$/i,
|
|
loader: 'babel-loader',
|
|
},
|
|
|
|
{
|
|
test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i,
|
|
type: 'asset',
|
|
},
|
|
// Add your rules for custom modules here
|
|
// Learn more about loaders from https://webpack.js.org/loaders/
|
|
],
|
|
},
|
|
};
|
|
|
|
module.exports = () => {
|
|
if (isProduction) {
|
|
config.mode = 'production';
|
|
|
|
config.plugins.push(new MiniCssExtractPlugin());
|
|
|
|
|
|
config.plugins.push(new WorkboxWebpackPlugin.GenerateSW());
|
|
|
|
} else {
|
|
config.mode = 'development';
|
|
}
|
|
return config;
|
|
};
|