xref: /openbmc/webui-vue/vue.config.js (revision 34e78de5a403f8f79d2efb881ee7b37619a3e6b9)
1const CompressionPlugin = require('compression-webpack-plugin');
2const webpack = require('webpack');
3const LimitChunkCountPlugin = webpack.optimize.LimitChunkCountPlugin;
4
5module.exports = {
6  css: {
7    loaderOptions: {
8      sass: {
9        additionalData: (() => {
10          const envName = process.env.VUE_APP_ENV_NAME;
11          const hasCustomStyles =
12            process.env.CUSTOM_STYLES === 'true' ? true : false;
13          if (hasCustomStyles && envName !== undefined) {
14            return `
15              @import "@/assets/styles/bmc/helpers";
16              @import "@/env/assets/styles/_${envName}";
17              @import "@/assets/styles/bootstrap/_helpers";
18            `;
19          } else {
20            return `
21              @import "@/assets/styles/bmc/helpers";
22              @import "@/assets/styles/bootstrap/_helpers";
23            `;
24          }
25        })(), // immediately invoked function expression (IIFE)
26      },
27    },
28  },
29  devServer: {
30    https: true,
31    proxy: {
32      '/': {
33        target: process.env.BASE_URL,
34        onProxyRes: (proxyRes) => {
35          delete proxyRes.headers['strict-transport-security'];
36        },
37      },
38    },
39    port: 8000,
40  },
41  productionSourceMap: false,
42  chainWebpack: (config) => {
43    config.resolve.alias.set('vue', '@vue/compat');
44    config.module
45      .rule('vue')
46      .use('vue-loader')
47      .tap((options) => {
48        options['compilerOptions'] = { compatConfig: { MODE: 2 } };
49        return options;
50      });
51    config.module
52      .rule('vue')
53      .use('vue-svg-inline-loader')
54      .loader('vue-svg-inline-loader');
55    config.module
56      .rule('ico')
57      .test(/\.ico$/)
58      .use('file-loader')
59      .loader('file-loader')
60      .options({
61        name: '[name].[contenthash:8].[ext]',
62      });
63    config.plugins.delete('preload');
64    if (process.env.NODE_ENV === 'production') {
65      config.plugin('html').tap((options) => {
66        options[0].filename = 'index.[hash:8].html';
67        return options;
68      });
69    }
70  },
71  configureWebpack: (config) => {
72    config.plugins.push(
73      new LimitChunkCountPlugin({
74        maxChunks: 1,
75      }),
76    );
77    config.optimization.splitChunks = {
78      cacheGroups: {
79        default: false,
80      },
81    };
82    const crypto = require('crypto');
83    const crypto_orig_createHash = crypto.createHash;
84    crypto.createHash = (algorithm) =>
85      crypto_orig_createHash(algorithm == 'md4' ? 'sha256' : algorithm);
86
87    const envName = process.env.VUE_APP_ENV_NAME;
88    const hasCustomStore = process.env.CUSTOM_STORE === 'true' ? true : false;
89    const hasCustomRouter = process.env.CUSTOM_ROUTER === 'true' ? true : false;
90    const hasCustomAppNav =
91      process.env.CUSTOM_APP_NAV === 'true' ? true : false;
92
93    if (envName !== undefined) {
94      if (hasCustomStore) {
95        // If env has custom store, resolve all store modules. Currently found
96        // in src/router/index.js src/store/api.js and src/main.js
97        config.resolve.alias['./store$'] = `@/env/store/${envName}.js`;
98        config.resolve.alias['../store$'] = `@/env/store/${envName}.js`;
99      }
100      if (hasCustomRouter) {
101        // If env has custom router, resolve routes in src/router/index.js
102        config.resolve.alias['./routes$'] = `@/env/router/${envName}.js`;
103      }
104      if (hasCustomAppNav) {
105        // If env has custom AppNavigation, resolve AppNavigationMixin module in src/components/AppNavigation/AppNavigation.vue
106        config.resolve.alias['./AppNavigationMixin$'] =
107          `@/env/components/AppNavigation/${envName}.js`;
108      }
109    }
110
111    if (process.env.NODE_ENV === 'production') {
112      config.plugins.push(
113        new CompressionPlugin({
114          deleteOriginalAssets: true,
115        }),
116      );
117    }
118
119    config.performance = {
120      hints: 'warning',
121      maxEntrypointSize: 512000,
122      maxAssetSize: 512000,
123    };
124
125    config.optimization.runtimeChunk = false;
126  },
127  pluginOptions: {
128    i18n: {
129      localeDir: 'locales',
130      enableInSFC: true,
131    },
132  },
133};
134