slimsh-pro/webpack.config.js at main · FaresAhmed23/slimsh-pro · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const ThemeWatcher = require("@salla.sa/twilight/watcher.js");
const CopyPlugin = require("copy-webpack-plugin");
const path = require("path");

const asset = (file) => path.resolve("src/assets", file || "");
const public = (file) => path.resolve("public", file || "");

module.exports = {
  entry: {
    app: [
      asset("styles/app.scss"),
      asset("js/wishlist.js"),
      asset("js/app.js"),
      asset("js/blog.js"),
    ],
    home: asset("js/home.js"),
    "product-card": asset("js/partials/product-card.js"),
    "main-menu": asset("js/partials/main-menu.js"),
    "wishlist-card": asset("js/partials/wishlist-card.js"),
    checkout: [asset("js/cart.js"), asset("js/thankyou.js")],
    pages: [asset("js/loyalty.js"), asset("js/brands.js")],
    product: [asset("js/product.js"), asset("js/products.js")],
    order: asset("js/order.js"),
    testimonials: asset("js/testimonials.js"),
    "recently-viewed": asset("js/recently-viewed.js"),
    "brand-filter": asset("js/brand-filter.js"),
    "bought-together": asset("js/bought-together.js"),
    "category-filters": asset("js/category-filters.js"),
  },
  output: {
    path: public(),
    clean: true,
    chunkFilename: "[name].[contenthash].js",
    publicPath: "http://localhost:8000/", // Add this
  },
  stats: { modules: false, assetsSort: "size", assetsSpace: 50 },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: [/(node_modules)/, asset("js/twilight.js")],
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env"],
            plugins: [
              [
                "@babel/plugin-transform-runtime",
                {
                  regenerator: true,
                },
              ],
            ],
          },
        },
      },
      {
        test: /\.(s(a|c)ss)$/,
        use: [
          MiniCssExtractPlugin.loader,
          { loader: "css-loader", options: { url: false } },
          "postcss-loader",
          "sass-loader",
        ],
      },
    ],
  },
  plugins: [
    new ThemeWatcher(),
    new MiniCssExtractPlugin(),
    new CopyPlugin({
      patterns: [{ from: asset("images"), to: public("images") }],
    }),
  ],
};