aotds-docks/webpack.config.js

80 lines
1.9 KiB
JavaScript

const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const path = require("path");
const mode = process.env.NODE_ENV || "development";
const prod = mode === "production";
module.exports = {
entry: {
bundle: ["./src/main.js"],
},
resolve: {
alias: {
svelte: path.resolve("node_modules", "svelte"),
'~': path.resolve(__dirname, 'src/'),
'~C': path.resolve(__dirname, 'src/components/'),
},
extensions: [".mjs", ".js", ".svelte"],
mainFields: ["svelte", "browser", "module", "main"],
},
output: {
path: __dirname + "/public",
filename: "[name].js",
chunkFilename: "[name].[id].js",
},
module: {
rules: [
{
test: /\.svelte$/,
use: {
loader: "svelte-loader",
options: {
emitCss: true,
hotReload: true,
},
},
},
{
test: /\.css$/,
use: [
/**
* MiniCssExtractPlugin doesn't support HMR.
* For developing, use 'style-loader' instead.
* */
prod ? MiniCssExtractPlugin.loader : "style-loader",
"css-loader",
],
},
{
test: /\.s[ac]ss$/i,
use: [
// Creates `style` nodes from JS strings
"style-loader",
// Translates CSS into CommonJS
"css-loader",
// Compiles Sass to CSS
{
loader: "sass-loader",
options: {
webpackImporter: false,
//implementation: require("node-sass"),
implementation: require("sass"),
sassOptions: {
indentWidth: 4,
includePaths: ["sass", "node_modules"],
},
},
},
],
},
],
},
mode,
plugins: [
new MiniCssExtractPlugin({
filename: "[name].css",
}),
],
devtool: prod ? false : "source-map",
};