Configuration

Table of Contents

• devServer
• proxy
• outputMapper
• clean
• apps
• templateFilename
• generateTemplate
• mergeWebpackConfig
• asyncSuffix
• copyToPublicIgnore
• workspaces
• uglifyOptions

Place a union.config.js file in the root of your project if you want to configure react-union-scripts.

Configuration file can export either:

• a static JSON object or
• a function.

If you pass a function, it will be called with an object describing the CLI arguments passed to a script:

// example of dynamic union.config.js
module.exports = ({
	target, // custom value
	script, // build, start or test
	app,
	debug,
	proxy,
	verbose,
	noHmr,
	analyze,
}) => ({
	outputMapper: target === 'liferay' ? { js: 'widgets/js' } : {},
});

Resulting configuration can redefine the following properties.

devServer

devServer.port : number

Port on which the development server listens for requests. Defaults to 3300.

devServer.historyApiFallback : boolean

If true, add connect-history-api-fallback middleware. Defaults to true.

proxy

proxy.port : number

Port on which the proxy server listens for requests. Defaults to 3300.

Note: This is the port that you want to visit in your browser.

proxy.target : string

URL to "wrap" with the proxy server. This should the URL that you're running the CMS or portal instance on.

proxy.publicPath : string

Public path of the application. See webpack. Required if you want to run proxy.

outputMapper

Output mapper makes it possible to further customize the folder structure that is produced by the build. All paths are relative to the apps[].paths.build directory.

outputMapper.js : string

Path of JavaScript assets. Defaults to static/js.

outputMapper.media : string

Path of media assets. Defaults to static/media.

clean

outputMapper.paths : string

Paths to clean before build. By default equals to [paths.build]

outputMapper.options : object

See clean-webpack-plugin

apps

Array of configurations for your applications. Every configuration is merged with above properties. You can rewrite them separately for every application.

For example in the following configuration:

module.exports = {
	proxy: { port: 3333 },
	apps: [
		{
			name: 'MyFirstApp',
			proxy: { port: 5000 },
		},
		{ name: 'MySecondApp' },
	],
};

MyFirstApp will use proxy.port: 5000 and MySecondApp will use 3333.

apps[].name : string

Name of your application that is used for:

• finding HTML template in ./public directory and
• naming your bundle file.

Required.

apps[].paths.build : string

Path to the build directory. Defaults to <project root>/build/<app name>.

apps[].paths.public : string

Path to public directory. The directory should contain:

• static assets to copy to the build directory
• a HTML template that is named according to templateFilename property.

Defaults to <project root>/public/<app name>.

apps[].paths.index : string

Path to the entry file of the application. Defaults to <project root>/apps/<app name>.

templateFilename

templateFilename : string

Name of the HTML template. Defaults to index.ejs.

generateTemplate

generateTemplate : boolean

If true, generates template using html-webpack-plugin. Defaults to true.

mergeWebpackConfig

mergeWebpackConfig : function

If specified, webpack.config generated by react-union-scripts is passed as the argument. Function must return new valid webpack config.

copyToPublicIgnore

copyToPublicIgnore : RegExp

Pattern for files that should not be copied from public folder in the build process. Defaults to /\.ejs$/.

workspaces

Workspaces can rewrite default patterns for monorepo matching.

workspaces.widgetPattern : string, array[string], RegExp

Pattern for the widget packages. Defaults to union-widget.

workspaces.appPattern : string, array[string], RegExp

Pattern for the app packages. Defaults to union-app.

uglifyOptions

Options for configuration of the underlying minifier engine (currently uglify-es).

Supported options:

• cache
• parallel
• sourceMap