feat: decouple @wpw/base and @wpw/react

It doesn't make sense to couple them together for using within scripts. So let's decouple them.
swashata · Sep 25, 2018 · 434c93f · 434c93f
1 parent d1ef753
commit 434c93f
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 43 deletions.
diff --git a/packages/babel-preset-react/README.md b/packages/babel-preset-react/README.md
@@ -1,7 +1,7 @@
 # `@wpw/babel-preset-react`
 
-This is the react specific babel preset for `@wpw/scripts`. It inherits everything
-from `@wpw/babel-preset-base` and expands on `@babel/preset-react`.
+This is the react specific babel preset for `@wpw/scripts`. It is based on `@babel/preset-react`.
+It doesn't inherit from `@wpw/base`, so make sure to include it in your babel config.
 
 ## Installation
 
@@ -53,13 +53,6 @@ module.exports = {
 	extends: [
 		'@wpw/react',
 		{
-			// Pass to @wpw/base
-			presetBase: {
-				noDynamicImport: true, // disable @babel/plugin-syntax-dynamic-import
-				presetEnv: {
-					target: 'not dead, > 0.25%', // browserslist query to pass to @babel/preset-env
-				},
-			},
 			// Pass to @babel/preset-react
 			presetReact: {
 				pragma: 'wp.element.createElement',
@@ -103,13 +96,12 @@ be used instead.
 }
 ```
 
-### `presetBase`
-
-`object`, defaults to `{}`.
-
-This is passed directly to [`@wpw/babel-preset-base`](https://github.com/swashata/wp-webpack-script/tree/master/packages/babel-preset-base).
+#### Why all `@babel/preset-react` is wrapped inside a separate object?
 
-You can have a `.browserslistrc` file, which will be detected by it and used.
+Because, right now, I can not know whether this preset would require any standalone
+options for its own, like `@wpw/base`. So I think, it is best to separate react
+options in a separate hash. In future, if we need some other options, then it can
+be conflict free.
 
 ## Development
 

diff --git a/packages/babel-preset-react/package.json b/packages/babel-preset-react/package.json
@@ -17,8 +17,7 @@
   "private": false,
   "dependencies": {
     "@babel/helper-plugin-utils": "^7.0.0",
-    "@babel/preset-react": "^7.0.0",
-    "@wpw/babel-preset-base": "^0.0.1"
+    "@babel/preset-react": "^7.0.0"
   },
   "peerDependencies": {
     "@babel/core": "^7.0.0-0"

diff --git a/packages/babel-preset-react/src/__tests__/preset.spec.js b/packages/babel-preset-react/src/__tests__/preset.spec.js
@@ -15,12 +15,8 @@ describe('@wpw/babel-preset-react', () => {
 	test('is a function', () => {
 		expect(typeof preset).toBe('function');
 	});
-	test('has both @wpw/base and @babel/preset-react presets', () => {
+	test('has @babel/preset-react presets', () => {
 		const babelConfig = preset();
-		const presetWpwBase = babelConfig.presets.filter(
-			ps => Array.isArray(ps) && ps[0] === '@wpw/base'
-		);
-		expect(presetWpwBase).toHaveLength(1);
 		const presetReact = babelConfig.presets.filter(
 			ps => Array.isArray(ps) && ps[0] === '@babel/preset-react'
 		);
@@ -78,23 +74,4 @@ describe('@wpw/babel-preset-react', () => {
 			expect(presetReactConfigWithDevelopment).toBe(false);
 		});
 	});
-
-	describe('for @wpw/base', () => {
-		test('passes presetBase to @wpw/base', () => {
-			const presetBase = {
-				noJsonStrings: true,
-				noImportMeta: false,
-				presetEnv: {
-					target: '> 1%, not dead',
-				},
-			};
-			const babelConfig = preset({ presetBase });
-			const presetBaseConfig = babelConfig.presets.find(
-				ps => Array.isArray(ps) && ps[0] === '@wpw/base'
-			)[1];
-			Object.keys(presetBase).forEach(pKey => {
-				expect(presetBaseConfig[pKey]).toEqual(presetBase[pKey]);
-			});
-		});
-	});
 });
diff --git a/packages/babel-preset-react/src/preset.js b/packages/babel-preset-react/src/preset.js
@@ -1,9 +1,8 @@
 export default (opts = {}) => {
 	// Extract @babel/preset-react options and base options
-	const { presetReact = {}, presetBase = {} } = opts;
+	const { presetReact = {} } = opts;
 	// Create the presets
 	const presets = [
-		['@wpw/base', { ...presetBase }],
 		[
 			'@babel/preset-react',
 			{