@dr.pogodin/react-utils
Version:
Collection of generic ReactJS components and utils
112 lines (111 loc) • 4.02 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.ENVIRONMENTS = void 0;
exports.default = getPreset;
const utils_1 = require("@dr.pogodin/babel-plugin-react-css-modules/utils");
const generateScopedNameDev = (0, utils_1.generateScopedNameFactory)('[package]___[path][name]___[local]___[hash:base64:6]');
const generateScopedNameProd = (0, utils_1.generateScopedNameFactory)('[hash:base64:6]');
/**
* Supported Babel environments.
*/
var ENVIRONMENTS;
(function (ENVIRONMENTS) {
ENVIRONMENTS["DEV"] = "development";
ENVIRONMENTS["PROD"] = "production";
ENVIRONMENTS["TEST"] = "test";
})(ENVIRONMENTS || (exports.ENVIRONMENTS = ENVIRONMENTS = {}));
/**
* Creates a new base config.
* @param [options] Base config options.
* @return Generated config.
*/
function newBaseConfig(options) {
var _a, _b;
return {
plugins: [
['module-resolver', {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
root: [
'./src/shared',
'./src',
],
}],
'@babel/transform-runtime',
],
presets: [
['@babel/env', {
// Leaves it to the Webpack to deal with modules.
modules: (_a = options.modules) !== null && _a !== void 0 ? _a : false,
targets: (_b = options.targets) !== null && _b !== void 0 ? _b : 'defaults',
}],
// TODO: Starting from Babel 8, "automatic" will be the default runtime,
// thus once upgraded to Babel 8, runtime should be removed from
// @babel/react options below.
['@babel/react', { runtime: 'automatic' }],
'@dr.pogodin/babel-preset-svgr',
],
};
}
/**
* Updates given `config` with styling ((S)CSS-related) setup.
*
* **Beware:** It mutates `config`.
*
* @param {object} config
* @param {string} env Target environment: `development` or `production`.
* @return {object} Returns mutated config for chaining.
* @ignore
*/
function addStyling(config, env) {
const cssModulesOps = {
autoResolveMultipleImports: true,
filetypes: {
'.scss': { syntax: 'postcss-scss' },
},
};
config.plugins.push(['@dr.pogodin/react-css-modules', cssModulesOps]);
switch (env) {
case ENVIRONMENTS.DEV:
case ENVIRONMENTS.TEST:
cssModulesOps.generateScopedName = generateScopedNameDev;
break;
case ENVIRONMENTS.PROD:
cssModulesOps.generateScopedName = generateScopedNameProd;
break;
default:
}
return config;
}
/**
* Generates Babel preset for Webpack.
* @param babel Babel compiler.
* @param [ops] Preset options.
* @param [ops.noRR] If truthy `react-refresh/babel` plugin is not
* included into config, no matter the environment.
* @param [ops.noStyling] If truthy all setup related to styling
* ((S)CSS processing) will be skipped.
* @param [ops.targets=defaults] Targets for
* `@babel/preset-env`.
* @return Generated config.
*/
function getPreset(babel, ops = {}) {
const env = babel.env();
const res = newBaseConfig(ops);
if (!ops.noStyling)
addStyling(res, env);
if (env === ENVIRONMENTS.DEV && !ops.noRR) {
res.plugins.push('react-refresh/babel');
}
// Conditional to not require non-TypeScript projects to install TypeScript-
// specific dependencies for build process.
if (ops.typescript) {
res.presets.push(['@babel/typescript', {
// This ensures TypeScript compilation does not remove "unused" imports,
// as in most cases it considers assets (e.g. stylesheet) imports as
// unused, while other steps of our build process rely on them
// (e.g. @dr.pogodin/react-css-modules plugin).
onlyRemoveTypeImports: true,
}]);
}
return res;
}