BasisCore.Client.Component.Grid/webpack.config.js at master · Manzoomeh/BasisCore.Client.Component.Grid · 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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
const path = require("path");
const CircularDependencyPlugin = require("circular-dependency-plugin");
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
const demoHttpServer = require("./server/http");

module.exports = (env, options) => {
  return {
    entry: {
      grid: {
        import: "./src/Loader.ts",
        filename: "basiscore.grid.js",
        library: {
          name: "grid",
          type: "assign",
        },
      },
      "grid.min": {
        import: "./src/Loader.ts",
        filename: "basiscore.grid.min.js",
        library: {
          name: "grid",
          type: "assign",
        },
      },
      gridComponent: {
        import: "./src/ComponentLoader.ts",
        filename: "basiscore.grid.component.js",
        library: {
          name: "grid",
          type: "assign",
        },
      },
      "gridComponent.min": {
        import: "./src/ComponentLoader.ts",
        filename: "basiscore.grid.component.min.js",
        library: {
          name: "grid",
          type: "assign",
        },
      },
    },
    externals: {
      basiscore: "basiscore",
    },
    devServer: {
      static: [
        {
          directory: path.resolve(__dirname, "wwwroot"),
        },
        {
          directory: path.resolve(__dirname, "node_modules/alasql/dist"),
        },
        {
          directory: path.resolve(__dirname, "node_modules/basiscore/dist"),
        },
      ],
      onBeforeSetupMiddleware: function (server) {
        server.app.use("/server", demoHttpServer);
      },
      open: true,
    },
    mode: options.mode,
    optimization: {
      minimize: options.mode === "production",
      minimizer: [
        new UglifyJsPlugin({
          include: /\.min\.js$/,
        }),
      ],
    },
    module: {
      rules: [
        {
          test: /\.ts$/i,
          use: ["ts-loader"],
        },
        {
          test: /\.css$/i,
          use: ["style-loader", "css-loader"],
        },
        {
          test: /\.html$/i,
          type: "asset/source",
        },
        {
          test: /\.(png|gif)/i,
          type: "asset/inline",
        },
      ],
    },
    resolve: {
      extensions: [".ts", ".tsx", ".js", ".jsx", ".html", ".css", ".png"], // there's a dot missing
    },
    plugins: [
      new CircularDependencyPlugin({
        // `onStart` is called before the cycle detection starts
        onStart({ compilation }) {
          console.log("start detecting webpack modules cycles");
        },
        // `onDetected` is called for each module that is cyclical
        onDetected({ module: webpackModuleRecord, paths, compilation }) {
          // `paths` will be an Array of the relative module paths that make up the cycle
          // `module` will be the module record generated by webpack that caused the cycle
          compilation.errors.push(new Error(paths.join(" -> ")));
        },
        // `onEnd` is called before the cycle detection ends
        onEnd({ compilation }) {
          console.log("end detecting webpack modules cycles");
        },
      }),
    ],
  };
};