nbcl

Configuration format

File name: nb.mjs

export default ({args, rawArgs, mode}) => {
	return {} // config
}

• mode: determined by the triggered command, value can be test, production, development.

Config format

• mode: should be the value passed to the config function. Default is the value passed to the config function.

• bundleBaseUrl: Default is null, which means the server serves the bundle file. Sample: https://cdn.my-app.com, no trailing slash.

• sourceMapBaseUrl.

• dev.port: port for bundle dev server. Default: 8081.

• dev.allowedHosts: allowed hosts in dev. For example: 192.168.0.2:8080,localhost:8080.

• dev.webpackDevServerWsUrl: default ws://localhost:${port}/ws.

• dev.bundleBaseUrl: overwrite bundleBaseUrl in dev mode. Default: http://localhost:${port}.

• transformImageInDev: boolean.

• enableServiceWorkerInDev: boolean.

• extractCssInDev: boolean.

• version: string, default undefined. Used to hard-code WEBPACK_version.

• postcssOptions: recommend below.

{
plugins: [
	tailwindcss(tailwindConfig),
	autoprefixer({
		overrideBrowserslist: defaultBrowserslist(isDev)({isServer: false})
	}),
	!isDev && cssnano(),
]
}

• browserslist({isServer}): return array of browserslist. isServer is true if the target is server. Below is the default browserslist. Note: the value of the below function is used in the config, not the function itself.

export function defaultBrowserslist(isDev) {
	return ({isServer}) => isServer ? ['current node'] : isDev
		? [
			'last 2 chrome versions',
			'last 2 firefox versions',
			'last 2 edge versions',
			'last 2 safari versions',
		]
		: [
			'>0.5%',
			'last 2 versions',
			'not dead',
			// order is matter
			// 'not ie > 0',
			// 'not ie_mob > 0', // # ie_mob is now dead for more than 24 months
			// 'not op_mini all', // # https://github.com/cssinjs/caniuse-support/blob/19bc5642e5b7382b9f6073e2339ffaf41306ba38/src/browser.ts#L47
			// '# to test, use: https://babeljs.io/repl/ and https://bl.transang.me',
			// '# not that they are not always return the same result.',
			// '# good to test example. Promise.allSettled is not available in iOS 12',
			// '# require("core-js/modules/es.promise.all-settled.js");',
		]
}

Other config

• Typing: in types.d.ts:

/// <reference types="nbcl/types" />