npm install --save-dev webpack-config-single-spa-react webpack-merge
# or
yarn add --dev webpack-config-single-spa-react webpack-merge
const singleSpaDefaults = require('webpack-config-single-spa-react');
const webpackMerge = require('webpack-merge');
module.exports = (webpackConfigEnv, argv) => {
const defaultConfig = singleSpaDefaults({
// The name of the organization this application is written for
orgName: 'name-of-company',
// The name of the current project. This usually matches the git repo's name
projectName: 'name-of-project',
// See https://webpack.js.org/guides/environment-variables/#root for explanation of webpackConfigEnv
webpackConfigEnv,
// The CLI commands in the package.json script that triggered this build
argv,
// optional
// This changes whether package names that start with @your-org-name are
// treated as webpack externals or not. Defaults to true
orgPackagesAsExternal: true,
// optional, defaults to 1
// This is the rootDirectoryLevel that is passed to https://github.com/joeldenning/systemjs-webpack-interop
rootDirectoryLevel: 1,
// optional, defaults to {}
// This controls the options given to standalone-single-spa-webpack-plugin
// See https://github.com/single-spa/standalone-single-spa-webpack-plugin#usage
standaloneOptions: {},
});
// modify the webpack config however you'd like to by adding to this object
});
};
const singleSpaDefaults = require('webpack-config-single-spa-react');
const webpackMerge = require('webpack-merge');
module.exports = (webpackConfigEnv, argv) => {
const defaultConfig = singleSpaDefaults({
// The name of the organization this application is written for
orgName: 'name-of-company',
// The name of the current project. This usually matches the git repo's name
projectName: 'name-of-project',
// See https://webpack.js.org/guides/environment-variables/#root for explanation of webpackConfigEnv
webpackConfigEnv,
// The CLI commands in the package.json script that triggered this build
argv,
// optional
// This changes whether package names that start with @your-org-name are
// treated as webpack externals or not. Defaults to true
orgPackagesAsExternal: true,
// optional, defaults to 1
// This is the rootDirectoryLevel that is passed to https://github.com/joeldenning/systemjs-webpack-interop
rootDirectoryLevel: 1,
// optional, defaults to {}
// This controls the options given to standalone-single-spa-webpack-plugin
// See https://github.com/single-spa/standalone-single-spa-webpack-plugin#usage
standaloneOptions: {},
});
return merge(defaultConfig, {
// modify the webpack config however you'd like to by adding to this object
});
};
A shareable, customizable webpack config that adds typescript-specific configuration to webpack-config-single-spa. Note that webpack-config-single-spa-ts has a peerDependency on typescript.