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