Repository URL to install this package:
|
Version:
3.6.0-rc.2-c44c3ce3093350 ▾
|
@doodle/frontend-config
/
webpack.js
|
|---|
/* eslint-disable global-require */
/* eslint-disable no-case-declarations */
const mergeWebpack = require('webpack-merge');
const mergeObject = require('deepmerge');
const createCommonConfig = require('./webpack/webpack.common');
/**
* @typedef {object} AppParameters
*
* @property {string} publicPath - The path in which the frontend will be exposed, excluding the "/"
* @property {string} pageTitle - The title of the HTML page
* @property {string} manifestDescription - The description of the purpose of the frontend
* @property {object} templateOptions - Custom options to configure HtmlWebpackPlugin or to expose variables in the index.ejs template
* @property {MocksConfiguration} mocks - The configuration for the dev environment mocks
* @property {undefined} prerenderRoutes - Custom array of routes that will be pre-rendered by PrerenderSPAPlugin (for production only)
*/
const defaultAppParameters = {
publicPath: '',
pageTitle: 'Doodle',
manifestDescription: 'Doodle',
templateOptions: {},
mocks: {},
// prerenderRoutes supports a dynamic default implemented in the webpack.{dev,prod}.js files
// for that reason it must be undefined here, to ensure such default is applied
// see https://github.com/DoodleScheduling/lib-frontend-config/pull/95/files#r452346002
prerenderRoutes: undefined,
};
/**
* @typedef {object} MocksConfiguration
* @description The configuration for the mocks used in development. The swagger json must be
* passed. It can optionally contain a map of custom handlers with keys in the form '<method> <endpoint>'
* (e.g. 'GET /foo'). Note: method+endpoint combination MUST be present in the swagger json, otherwise
* the custom handler will be ignored!
* @property {string|Object} swaggerJson - The swagger definitions object or path to the json file, used to generate the mocks in dev mode
* @property {object<string,function>} [routeHandlers] - A map of custom route handlers.
* @see https://expressjs.com/en/api.html#router
*/
/**
* Default configuration for React frontends.
*
* How to use:
* Create a webpack.config.js file in your project and extend this configuration as
* shown in the following example.
*
* @example
* // File: web-my-frontend/webpack.config.js
* const { generateWebpackConfig } = require('@doodle/frontend-config/webpack');
*
* module.exports = generateWebpackConfig({
* customOptions: {
* // custom webpack options
* },
* appParameters: {
* publicPath: 'my-frontend',
* pageTitle: 'My Frontend',
* manifestDescription: 'My test frontend used to show how webpack configuration works',
* templateOptions: {
* appConfig: {
* // custom app data
* },
* prerenderAppConfig: {
* disableLoadUserOnBoot: true,
* }
* },
* postProcessPrerenderedHtml: html => html,
* mocks: {
* swaggerJson: path.resolve(__dirname, 'swagger.json'),
* },
* }
* });
*/
module.exports = {
/**
* @param {object} customWebpackOptions Custom webpack options to merge to the default configuration
* @param {AppParameters} appParameters App parameters
*/
generateWebpackConfig: async ({ customWebpackOptions, appParameters }) => {
const mergedAppParameters = mergeObject(defaultAppParameters, appParameters);
switch (process.env.npm_lifecycle_event) {
case 'start':
const createDevConfig = require('./webpack/webpack.dev');
// Generates the code that runs in the local development environment
return mergeWebpack(
await createCommonConfig({ babelTargetEnv: 'modern', ...mergedAppParameters }),
await createDevConfig(mergedAppParameters),
customWebpackOptions
);
case 'build':
const createProdConfig = require('./webpack/webpack.prod');
return [
// Generates the production bundle for modern browsers (ES6+ code)
mergeWebpack(
await createCommonConfig({ babelTargetEnv: 'modern', ...mergedAppParameters }),
await createProdConfig({ babelTargetEnv: 'modern', ...mergedAppParameters }),
customWebpackOptions
),
// Generates the production bundle for old browsers (ES5 code)
mergeWebpack(
await createCommonConfig({ babelTargetEnv: 'fallback', ...mergedAppParameters }),
await createProdConfig({ babelTargetEnv: 'fallback', ...mergedAppParameters }),
customWebpackOptions
),
];
default:
break;
}
},
};