xref: /openbmc/webui-vue/vue.config.js (revision d7cd12c2) 
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        prependData: () => {
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            // If there is an env name defined, import Sass
15            // overrides.
16            // It is important that these imports stay in this
17            // order to make sure enviroment overrides
18            // take precedence over the default BMC styles
19            return `
20              @import "@/assets/styles/bmc/helpers";
21              @import "@/env/assets/styles/_${envName}";
22              @import "@/assets/styles/bootstrap/_helpers";
23            `;
24          } else {
25            // Include helper imports so single file components
26            // do not need to include helper imports
27
28            // BMC Helpers must be imported before Bootstrap helpers to
29            // take advantage of Bootstrap's use of the Sass !default
30            // statement. Moving this helper after results in Bootstrap
31            // variables taking precedence over BMC's
32            return `
33              @import "@/assets/styles/bmc/helpers";
34              @import "@/assets/styles/bootstrap/_helpers";
35            `;
36          }
37        },
38      },
39    },
40  },
41  devServer: {
42    https: true,
43    proxy: {
44      '/': {
45        target: process.env.BASE_URL,
46        headers: {
47          Connection: 'keep-alive',
48        },
49        onProxyRes: (proxyRes) => {
50          // This header is ignored in the browser so removing
51          // it so we don't see warnings in the browser console
52          delete proxyRes.headers['strict-transport-security'];
53        },
54      },
55    },
56    port: 8000,
57  },
58  productionSourceMap: false,
59  chainWebpack: (config) => {
60    config.module
61      .rule('vue')
62      .use('vue-svg-inline-loader')
63      .loader('vue-svg-inline-loader');
64    config.module
65      .rule('ico')
66      .test(/\.ico$/)
67      .use('file-loader')
68      .loader('file-loader')
69      .options({
70        name: '[name].[contenthash:8].[ext]',
71      });
72    config.plugins.delete('preload');
73    if (process.env.NODE_ENV === 'production') {
74      config.plugin('html').tap((options) => {
75        options[0].filename = 'index.[hash:8].html';
76        return options;
77      });
78    }
79  },
80  configureWebpack: (config) => {
81    config.plugins.push(
82      new LimitChunkCountPlugin({
83        maxChunks: 1,
84      }),
85    );
86    config.optimization.splitChunks = {
87      cacheGroups: {
88        default: false,
89      },
90    };
91    const crypto = require('crypto');
92    const crypto_orig_createHash = crypto.createHash;
93    crypto.createHash = (algorithm) =>
94      crypto_orig_createHash(algorithm == 'md4' ? 'sha256' : algorithm);
95
96    const envName = process.env.VUE_APP_ENV_NAME;
97    const hasCustomStore = process.env.CUSTOM_STORE === 'true' ? true : false;
98    const hasCustomRouter = process.env.CUSTOM_ROUTER === 'true' ? true : false;
99    const hasCustomAppNav =
100      process.env.CUSTOM_APP_NAV === 'true' ? true : false;
101
102    if (envName !== undefined) {
103      if (hasCustomStore) {
104        // If env has custom store, resolve all store modules. Currently found
105        // in src/router/index.js src/store/api.js and src/main.js
106        config.resolve.alias['./store$'] = `@/env/store/${envName}.js`;
107        config.resolve.alias['../store$'] = `@/env/store/${envName}.js`;
108      }
109      if (hasCustomRouter) {
110        // If env has custom router, resolve routes in src/router/index.js
111        config.resolve.alias['./routes$'] = `@/env/router/${envName}.js`;
112      }
113      if (hasCustomAppNav) {
114        // If env has custom AppNavigation, resolve AppNavigationMixin module in src/components/AppNavigation/AppNavigation.vue
115        config.resolve.alias['./AppNavigationMixin$'] =
116          `@/env/components/AppNavigation/${envName}.js`;
117      }
118    }
119
120    if (process.env.NODE_ENV === 'production') {
121      config.plugins.push(
122        new CompressionPlugin({
123          deleteOriginalAssets: true,
124        }),
125      );
126    }
127
128    config.performance = {
129      hints: 'warning',
130      maxEntrypointSize: 512000,
131      maxAssetSize: 512000,
132    };
133
134    config.optimization.runtimeChunk = false;
135  },
136  pluginOptions: {
137    i18n: {
138      localeDir: 'locales',
139      enableInSFC: true,
140    },
141  },
142};
143