generator-jhipster 7.3.0 → 7.5.0

package/generators/client/templates/vue/webpack/webpack.common.js.ejs

@@ -3,155 +3,179 @@ const path = require('path');
 const { merge } = require('webpack-merge');
 const { VueLoaderPlugin } = require('vue-loader');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
 <%_ if (enableTranslation) { _%>
 const { hashElement } = require('folder-hash');
 const MergeJsonWebpackPlugin = require('merge-jsons-webpack-plugin');
 <%_ } _%>
-const { DefinePlugin } = require('webpack');
-const vueLoaderConfig = require('./loader.conf');
 
-function resolve(dir) {
+const { DefinePlugin, EnvironmentPlugin } = require('webpack');
+const { vueLoaderConfig } = require('./vue.utils');
+const config = require('./config');
+
+function resolve(dir = '') {
   return path.join(__dirname, '..', dir);
 }
 
-module.exports = async env => {
+module.exports = async (env, options) => {
+  const development = options.mode === 'development';
 <%_ if (enableTranslation) { _%>
-  const languagesHash = await hashElement(path.resolve(__dirname, '../<%= MAIN_SRC_DIR %>i18n'), {
+  const languagesHash = await hashElement(resolve('<%= MAIN_SRC_DIR %>i18n'), {
     algo: 'md5',
     encoding: 'hex',
     files: { include: ['*.json'] },
   });
 
 <%_ } _%>
-
   return merge(
-{
-  mode: 'development',
-  context: path.resolve(__dirname, '../'),
-  entry: {
-    app: './<%= CLIENT_MAIN_SRC_DIR %>app/main.ts'
-  },
-  resolve: {
-    extensions: ['.ts', '.js', '.vue', '.json'],
-    alias: {
-      vue$: 'vue/dist/vue.esm.js',
-      '@': resolve('<%= CLIENT_MAIN_SRC_DIR %>app')
-    },
-    fallback: {
-      // prevent webpack from injecting useless setImmediate polyfill because Vue
-      // source contains it (although only uses it if it's native).
-      setImmediate: false,
-      // prevent webpack from injecting mocks to Node native modules
-      // that does not make sense for the client
-      dgram: 'empty',
-      fs: 'empty',
-      net: 'empty',
-      tls: 'empty',
-      child_process: 'empty',
-    },
-  },
-  cache: {
-    // 1. Set cache type to filesystem
-    type: 'filesystem',
-    cacheDirectory: path.resolve(__dirname, '../<%= buildDir %>webpack'),
-    buildDependencies: {
-      // 2. Add your config as buildDependency to get cache invalidation on config change
-      config: [
-        __filename,
-        path.resolve(__dirname, `webpack.${env.env == 'development' ? 'dev' : 'prod'}.js`),
-        path.resolve(__dirname, 'utils.js'),
-        path.resolve(__dirname, '../.postcssrc.js'),
-        path.resolve(__dirname, '../tsconfig.json')
-      ],
-    },
-  },
-  module: {
-    rules: [
-      {
-        test: /\.vue$/,
-        loader: 'vue-loader',
-        options: vueLoaderConfig
+    {
+      mode: options.mode,
+      context: resolve(),
+<%_ if (applicationTypeGateway && microfrontend) { _%>
+      experiments: {
+        topLevelAwait: true,
+      },
+<%_ } _%>
+      entry: {
+        app: './<%= CLIENT_MAIN_SRC_DIR %>app/<%= microfrontend ? 'index' : 'main' %>.ts',
+      },
+      output: {
+        path: resolve('<%= DIST_DIR %>'),
       },
-      {
-        test: /\.ts$/,
-        use: [
+      resolve: {
+        extensions: ['.ts', '.js', '.vue', '.json'],
+        alias: {
+          vue$: 'vue/dist/vue.esm.js',
+          '@': resolve('<%= CLIENT_MAIN_SRC_DIR %>app'),
+        },
+      },
+      devServer: {
+<%_ if (microfrontend) { _%>
+        hot: config.dev.hotReload,
+<%_ } _%>
+        static: {
+          directory: './<%= DIST_DIR %>',
+        },
+        port: <%= devServerPort %>,
+        proxy: [
           {
-            loader: 'ts-loader',
-            options: {
-              appendTsSuffixTo: ['\\.vue$'],
-              happyPackMode: true,
-              transpileOnly: true
-            }
+            context: [
+              '/api',
+              '/services',
+              '/management',
+              '/v3/api-docs',
+              '/h2-console',
+<%_ if (authenticationTypeOauth2) { _%>
+              '/oauth2',
+              '/login',
+<%_ } _%>
+              '/auth'
+            ],
+            target: 'http://localhost:<%= this.applicationTypeMicroservice ? gatewayServerPort : serverPort %>',
+            secure: false,
+          },
+<%_ if (communicationSpringWebsocket) { _%>
+          {
+            context: [
+              '/websocket'
+            ],
+            target: 'ws://localhost:<%= this.applicationTypeMicroservice ? gatewayServerPort : serverPort %>',
+            ws: true
           }
+<%_ } _%>
         ],
-        include: [resolve('src'), resolve('test')]
+        historyApiFallback: true
       },
-      {
-        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
-        loader: 'url-loader',
-        options: {
-          limit: 10000,
-          name: 'content/[hash].[ext]',
-          publicPath: "../"
-        }
+      cache: {
+        // 1. Set cache type to filesystem
+        type: 'filesystem',
+        cacheDirectory: resolve('<%= buildDir %>webpack'),
+        buildDependencies: {
+          // 2. Add your config as buildDependency to get cache invalidation on config change
+          config: [
+            __filename,
+            path.resolve(__dirname, 'config.js'),
+            path.resolve(__dirname, 'vue.utils.js'),
+            path.resolve(__dirname, `webpack.${development ? 'dev' : 'prod'}.js`),
+            path.resolve(__dirname, '../.postcssrc.js'),
+            path.resolve(__dirname, '../tsconfig.json'),
+          ],
+        },
       },
-      {
-        test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
-        loader: 'url-loader',
-        options: {
-          limit: 10000,
-          name: 'content/[hash].[ext]',
-          publicPath: "../"
-        }
+      module: {
+        rules: [
+          {
+            test: /\.vue$/,
+            loader: 'vue-loader',
+            options: vueLoaderConfig(!development),
+          },
+          {
+            test: /\.ts$/,
+            use: [
+              {
+                loader: 'ts-loader',
+                options: {
+                  appendTsSuffixTo: ['\\.vue$'],
+                  happyPackMode: true,
+                  transpileOnly: true,
+                },
+              },
+            ],
+            include: [resolve('src'), resolve('test')],
+          },
+          {
+            test: /\.(png|jpe?g|gif|svg|mp4|webm|ogg|mp3|wav|flac|aac|woff2?|eot|ttf|otf)/,
+            type: 'asset/resource',
+          },
+        ],
       },
-      {
-        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
-        loader: 'url-loader',
-        options: {
-          limit: 10000,
-          name: 'content/[hash].[ext]',
-          publicPath: "../"
-        }
-      }
-    ]
-  },
-  plugins: [
-    new DefinePlugin({
+      plugins: [
+        new EnvironmentPlugin({
+          // Required by vuelidate https://github.com/vuelidate/vuelidate/issues/365
+          BUILD: 'web',
+        }),
+        new DefinePlugin({
 <%_ if (enableTranslation) { _%>
-      I18N_HASH: JSON.stringify(languagesHash.hash),
+          I18N_HASH: JSON.stringify(languagesHash.hash),
 <%_ } _%>
-      'process.env': require(env.env == 'development' ? './dev.env' : './prod.env'),
-    }),
-    new VueLoaderPlugin(),
-    new CopyWebpackPlugin({
-      patterns: [
-        {
-          context: './node_modules/swagger-ui-dist/',
-          from: '*.{js,css,html,png}',
-          to: 'swagger-ui/',
-          globOptions: { ignore: ['**/index.html'] },
-        },
-        { from: './node_modules/axios/dist/axios.min.js', to: 'swagger-ui/' },
-        { from: './<%= CLIENT_MAIN_SRC_DIR %>swagger-ui/', to: 'swagger-ui/' },
-        { from: './<%= CLIENT_MAIN_SRC_DIR %>content/', to: 'content/' },
-        { from: './<%= CLIENT_MAIN_SRC_DIR %>favicon.ico', to: 'favicon.ico' },
-        {
-          from: './<%= CLIENT_MAIN_SRC_DIR %>manifest.webapp',
-          to: 'manifest.webapp',
-        },
-        // jhipster-needle-add-assets-to-webpack - JHipster will add/remove third-party resources in this array
-        { from: './<%= CLIENT_MAIN_SRC_DIR %>robots.txt', to: 'robots.txt' },
-      ]
-    })<% if (enableTranslation) { %>,
-    new MergeJsonWebpackPlugin({
-      output: {
-        groupBy: [
-          // jhipster-needle-i18n-language-webpack - JHipster will add/remove languages in this array
-        ]
-      }
-    })<% } %>
-  ]
-}
-// jhipster-needle-add-webpack-config - JHipster will add custom config
-);
+          VERSION: JSON.stringify(config.version),
+          SERVER_API_URL: JSON.stringify(config.serverApiUrl),
+        }),
+        new HtmlWebpackPlugin({
+          base: '/',
+          template: './<%= MAIN_SRC_DIR %>index.html',
+        }),
+        new VueLoaderPlugin(),
+        new CopyWebpackPlugin({
+          patterns: [
+            {
+              context: './node_modules/swagger-ui-dist/',
+              from: '*.{js,css,html,png}',
+              to: 'swagger-ui/',
+              globOptions: { ignore: ['**/index.html'] },
+            },
+            { from: './node_modules/axios/dist/axios.min.js', to: 'swagger-ui/' },
+            { from: './<%= CLIENT_MAIN_SRC_DIR %>swagger-ui/', to: 'swagger-ui/' },
+            { from: './<%= CLIENT_MAIN_SRC_DIR %>content/', to: 'content/' },
+            { from: './<%= CLIENT_MAIN_SRC_DIR %>favicon.ico', to: 'favicon.ico' },
+            {
+              from: './<%= CLIENT_MAIN_SRC_DIR %>manifest.webapp',
+              to: 'manifest.webapp',
+            },
+            // jhipster-needle-add-assets-to-webpack - JHipster will add/remove third-party resources in this array
+            { from: './<%= CLIENT_MAIN_SRC_DIR %>robots.txt', to: 'robots.txt' },
+          ],
+        })<% if (enableTranslation) { %>,
+        new MergeJsonWebpackPlugin({
+          output: {
+            groupBy: [
+              // jhipster-needle-i18n-language-webpack - JHipster will add/remove languages in this array
+            ],
+          },
+        }),<% } %>
+      ],
+    },
+    await require(`./webpack.${development ? 'dev' : 'prod'}`)(env, options)
+    // jhipster-needle-add-webpack-config - JHipster will add custom config
+  );
 };

package/generators/client/templates/vue/webpack/webpack.dev.js.ejs

@@ -18,89 +18,31 @@
 -%>
 'use strict';
 const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
-const portfinder = require('portfinder');
 const webpack = require('webpack');
-const { merge: webpackMerge } = require('webpack-merge');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
 
-const utils = require('./vue.utils');
-const config = require('./env');
-const commonConfig = require('./webpack.common');
-const jhiUtils = require('./utils.js');
-const MODE = 'development';
+const { styleLoaders } = require('./vue.utils');
+const config = require('./config');
 
-module.exports = async env => webpackMerge(await commonConfig({ env: MODE }), {
-  mode: MODE,
-  module: {
-    rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
-  },
-  // cheap-module-eval-source-map is faster for development
-  devtool: config.dev.devtool,
-  entry: {
-    global: './<%= MAIN_SRC_DIR %>content/scss/global.scss',
-    main: './<%= MAIN_SRC_DIR %>app/main'
-  },
-  output: {
-    path: jhiUtils.root('<%= DIST_DIR %>'),
-    filename: 'app/[contenthash].bundle.js',
-    chunkFilename: 'app/[id].chunk.js'
-  },
-  optimization: {
-    moduleIds: 'named',
-  },
-  devServer: {
-    static: {
-      directory: './<%= DIST_DIR %>',
+module.exports = (env, options) => {
+  const devConfig = {
+    module: {
+      rules: styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
     },
-    port: <%= devServerPort %>,
-    proxy: [
-      {
-        context: [
-          '/api',
-          '/services',
-          '/management',
-          '/swagger-resources',
-          '/v2/api-docs',
-          '/v3/api-docs',
-          '/h2-console',
-<%_ if (authenticationTypeOauth2) { _%>
-          '/oauth2',
-          '/login',
-<%_ } _%>
-          '/auth'
-        ],
-        target: 'http://127.0.0.1:<%= serverPort %>',
-        secure: false,
-        headers: { host: 'localhost:9000' }
-      },
-<%_ if (communicationSpringWebsocket) { _%>
-      {
-        context: [
-          '/websocket'
-        ],
-        target: 'ws://127.0.0.1:<%= serverPort %>',
-        ws: true
-      }
-<%_ } _%>
-    ],
-    historyApiFallback: true
-  },
-  plugins: [
-    new webpack.HotModuleReplacementPlugin(),
-    new webpack.NoEmitOnErrorsPlugin(),
-    new HtmlWebpackPlugin({
-      base: '/',
-      template: './<%= MAIN_SRC_DIR %>index.html',
-      chunks: ['vendors', 'main', 'global'],
-      chunksSortMode: 'manual',
-      inject: true
-    }),
+    // cheap-module-eval-source-map is faster for development
+    devtool: config.dev.devtool,
+    optimization: {
+      moduleIds: 'named',
+    },
+    plugins: [],
+  };
+  if (!options.env.WEBPACK_SERVE) return devConfig;
+  devConfig.plugins.push(
     new BrowserSyncPlugin(
       {
         host: 'localhost',
         port: 9000,
         proxy: {
-          target: 'http://localhost:<%= devServerPort %>',
+          target: `http://localhost:${options.watch ? '<%= this.applicationTypeMicroservice ? gatewayServerPort : serverPort %>' : '<%= devServerPort %>'}`,
 <%_ if (communicationSpringWebsocket) { _%>
           ws: true,
 <%_ } _%>
@@ -122,5 +64,6 @@ module.exports = async env => webpackMerge(await commonConfig({ env: MODE }), {
         reload: true
       }
     )
-  ]
-});
+  );
+  return devConfig;
+};

package/generators/client/templates/vue/webpack/webpack.microfrontend.js.jhi.vue.ejs

@@ -0,0 +1,77 @@
+<%#
+ Copyright 2013-2021 the original author or authors from the JHipster project.
+
+ This file is part of the JHipster project, see https://www.jhipster.tech/
+ for more information.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+      https://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+-%>
+<&_ if (fragment.importsSection) { -&>
+<%_ if (applicationTypeMicroservice) { _%>
+const { DefinePlugin } = require('webpack');
+<%_ } _%>
+<&_ } -&>
+<&_ if (fragment.moduleFederationSection) { -&>
+<%_ if (applicationTypeGateway) { _%>
+        remotes: {
+  <%_ for (const remote of microfrontends) { _%>
+          '@<%= remote.lowercaseBaseName %>': `<%= remote.lowercaseBaseName %>@/<%= remote.endpointPrefix %>/remoteEntry.js`,
+  <%_ } _%>
+        },
+<%_ } _%>
+<%_ if (applicationTypeMicroservice) { _%>
+        exposes: {
+          './entities-router': './<%= CLIENT_MAIN_SRC_DIR %>app/router/entities',
+          './entities-menu': './<%= CLIENT_MAIN_SRC_DIR %>app/entities/entities-menu',
+        },
+<%_ } _%>
+        shared: {
+          axios: { singleton: true, shareScope: 'default' },
+          'vue-loader': { eager: true, singleton: false, shareScope: 'default' },
+          'bootstrap-vue': { singleton: true, shareScope: 'default' },
+          vue: { singleton: true, shareScope: 'default' },
+          vuelidate: { singleton: true, shareScope: 'default' },
+          'vue-class-component': { singleton: true, shareScope: 'default' },
+          'vue-i18n': { singleton: true, shareScope: 'default' },
+          'vue-router': { singleton: true, shareScope: 'default' },
+          'vue2-filters': { singleton: true, shareScope: 'default' },
+          vuex: { singleton: true, shareScope: 'default' },
+          'vue-property-decorator': { singleton: true, shareScope: 'default' },
+          '@/shared/security/authority': {
+            singleton: true,
+            shareScope: 'default',
+            import: '@/shared/security/authority',
+            requiredVersion: appVersion,
+          },
+          '@/shared/alert/alert.service': {
+            singleton: true,
+            shareScope: 'default',
+            import: '@/shared/alert/alert.service',
+            requiredVersion: appVersion,
+          },
+          '@/locale/translation.service': {
+            singleton: true,
+            shareScope: 'default',
+            import: '@/locale/translation.service',
+            requiredVersion: appVersion,
+          },
+        },
+<&_ } -&>
+<&_ if (fragment.pluginsSection) { -&>
+<%_ if (applicationTypeMicroservice) { _%>
+      new DefinePlugin({
+        <%= _.upperCase(baseName) %>_I18N_RESOURCES_PREFIX: JSON.stringify(''),
+      }),
+<%_ } _%>
+<&_ } -&>
+

package/generators/client/templates/vue/webpack/webpack.prod.js.ejs

@@ -18,40 +18,24 @@
 -%>
 'use strict';
 const webpack = require('webpack');
-const webpackMerge = require('webpack-merge').merge;
-const HtmlWebpackPlugin = require('html-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 const WorkboxPlugin = require('workbox-webpack-plugin');
 const TerserPlugin = require('terser-webpack-plugin');
 const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin');
 
-const utils = require('./vue.utils');
-const config = require('./env');
-const baseWebpackConfig = require('./webpack.common');
-const jhiUtils = require('./utils.js');
-
-const MODE = 'production';
+const { styleLoaders } = require('./vue.utils');
+const config = require('./config');
 
 const webpackConfig = {
-  mode: MODE,
   module: {
-    rules: utils.styleLoaders({
+    rules: styleLoaders({
       sourceMap: config.build.productionSourceMap,
       extract: true,
       usePostCSS: true
     })
   },
   devtool: config.build.productionSourceMap ? config.build.devtool : false,
-  entry: {
-    global: './<%= MAIN_SRC_DIR %>content/scss/global.scss',
-    main: './<%= MAIN_SRC_DIR %>app/main'
-  },
-  output: {
-    path: jhiUtils.root('<%= DIST_DIR %>'),
-    filename: 'app/[name].[contenthash].bundle.js',
-    chunkFilename: 'app/[id].[chunkhash].chunk.js'
-  },
   optimization: {
     moduleIds: 'deterministic',
     minimizer: [
@@ -106,27 +90,7 @@ const webpackConfig = {
       extractComments: false,
     }),
     // extract css into its own file
-    new MiniCssExtractPlugin({
-      filename: 'content/[name].[contenthash].css',
-      chunkFilename: 'content/[id].css'
-    }),
-    // generate dist index.html with correct asset hash for caching.
-    // you can customize output by editing /index.html
-    // see https://github.com/ampedandwired/html-webpack-plugin
-    new HtmlWebpackPlugin({
-      base: '/',
-      template: './<%= MAIN_SRC_DIR %>index.html',
-      chunks: ['vendors', 'main', 'global'],
-      chunksSortMode: 'manual',
-      inject: true,
-      minify: {
-        removeComments: true,
-        collapseWhitespace: true,
-        removeAttributeQuotes: true
-        // more options:
-        // https://github.com/kangax/html-minifier#options-quick-reference
-      },
-    }),
+    new MiniCssExtractPlugin(),
     // keep module.id stable when vendor modules does not change
     new ForkTsCheckerWebpackPlugin(
       {
@@ -170,4 +134,4 @@ if (config.build.bundleAnalyzerReport) {
   webpackConfig.plugins.push(new BundleAnalyzerPlugin());
 }
 
-module.exports = async () => webpackMerge(await baseWebpackConfig({ env: MODE }), webpackConfig);
+module.exports = async () => webpackConfig;

package/generators/cloudfoundry/index.js

@@ -35,12 +35,12 @@ const NO_DATABASE_TYPE = databaseTypes.NO;
 
 const exec = childProcess.exec;
 
-let useBlueprints;
 /* eslint-disable consistent-return */
 module.exports = class extends BaseBlueprintGenerator {
-  constructor(args, options, features) {
-    super(args, options, features);
-    useBlueprints = !this.fromBlueprint && this.instantiateBlueprints(GENERATOR_CLOUDFOUNDRY);
+  async _postConstruct() {
+    if (!this.fromBlueprint) {
+      await this.composeWithBlueprints(GENERATOR_CLOUDFOUNDRY);
+    }
   }
 
   _initializing() {
@@ -66,7 +66,7 @@ module.exports = class extends BaseBlueprintGenerator {
   }
 
   get initializing() {
-    if (useBlueprints) return;
+    if (this.delegateToBlueprint) return {};
     return this._initializing();
   }
 
@@ -75,7 +75,7 @@ module.exports = class extends BaseBlueprintGenerator {
   }
 
   get prompting() {
-    if (useBlueprints) return;
+    if (this.delegateToBlueprint) return {};
     return this._prompting();
   }
 
@@ -115,7 +115,7 @@ module.exports = class extends BaseBlueprintGenerator {
   }
 
   get configuring() {
-    if (useBlueprints) return;
+    if (this.delegateToBlueprint) return {};
     return this._configuring();
   }
 
@@ -182,7 +182,7 @@ module.exports = class extends BaseBlueprintGenerator {
   }
 
   get default() {
-    if (useBlueprints) return;
+    if (this.delegateToBlueprint) return {};
     return this._default();
   }
 
@@ -232,7 +232,7 @@ module.exports = class extends BaseBlueprintGenerator {
   }
 
   get end() {
-    if (useBlueprints) return;
+    if (this.delegateToBlueprint) return {};
     return this._end();
   }
 };