webpack-simple - npm Package Compare versions

Comparing version 1.5.1 to 1.5.2

package.json

 {
   "name": "webpack-simple",
-  "version": "1.5.1",
+  "version": "1.5.2",
   "description": "Webpack Config - Simple defaults, extendable options",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -19,3 +19,6 @@ # Webpack Simple
 
-Webpack is great, but the configuration is verbose. Webpack 4 improved things with a config-less setup, but as soon as you want something beyond the defaults you need an entire config. This package aims to give you the best of both worlds: a simple config, with the ability to configure just the parts you want.
+Webpack is great, but the configuration is verbose. Webpack 4 improved things
+with a config-less setup, but as soon as you want something beyond the defaults
+you need an entire config. This package aims to give you the best of both
+worlds: a simple config, with the ability to configure just the parts you want.
 
@@ -30,3 +33,4 @@ ```js
 
-This will generate a webpack config in `development` mode, with Babel/React and css/sass loaders. It's the equivalent of:
+This will generate a webpack config in `development` mode, with Babel/React and
+css/sass loaders. It's the equivalent of:
 
@@ -90,12 +94,58 @@ ```js
 
-...or just add/overwrite/modify the default JS/CSS loaders:
+...or keep the above rules and just add/modify the default JS/CSS loaders:
 
 ```js
-const { makeJS } = require('webpack-simple');
+const { makeJS, makeCSS } = require('webpack-simple');
 
-const customUse = [{ loader: 'other-loader', options: { foo: 'bar' } }];
-const customJSConfig = makeWebpackConfig({ js: makeJS({ use: customUse }) });
-const customCSSConfig = makeWebpackConfig({ css: makeCSS({ use: customUse }) });
+const use = [{ loader: 'other-loader', options: { foo: 'bar' } }];
+
+const js = makeJS({ use });
+const css = makeCSS({ use });
+
+const customJSConfig = makeWebpackConfig({ js });
+const customCSSConfig = makeWebpackConfig({ css });
 ```
 
+By default, `makeJS` and `makeCSS` will return the JS/CSS rules in the config
+above.
+
+`makeJS` allows you to modify/override `use`, `exclude`, `babelPresets`, and
+`babelPlugins`.
+
+```js
+const customJS = makeJS({ exclude: /testing/, babelPresets: 'some-preset' });
+
+// customJS returns:
+// {
+//   test: /\.jsx?$/,
+//   exclude: [/testing/],
+//   use: [
+//     {
+//       loader: 'babel-loader',
+//       options: {
+//         presets: ['some-preset'],
+//         plugins: ['@babel/plugin-proposal-class-properties'],
+//       },
+//     },
+//   ],
+// }
+```
+
+`makeCSS` allows you to modify/override `use`, `cssLoaderOptions`, and
+`sassLoaderOptions`.
+
+```js
+const customCSS = makeCSS({ cssLoaderOptions: { foo: 'bar' } });
+
+// customCSS returns:
+// {
+//   test: /\.s?css$/,
+//   use: [
+//     { loader: 'style-loader' },
+//     { loader: 'css-loader', options: { foo: 'bar' } },
+//     { loader: 'sass-loader', options: { modules: true } },
+//   ],
+// }
+```
+
 The full config input options with defaults:
@@ -112,7 +162,8 @@
   // All top-level webpack config options are available
-  // as input options (all default to undefined)
+  // as input options (all default to undefined):
+
+  entry, // Falls back to Webpack's default: '/src/index.js'
+  output, // Falls back to Webpack's default '/dist/main.js'
   serve,
   stats,
-  entry, // Falls back to Webpack's default: '/src/index.js'
-  output, // Falls back to Webpack's default '/dist/main.js'
   devtool,
@@ -124,3 +175,3 @@ resolve,
   performance,
-})
+});
 ```
@@ -127,0 +178,0 @@

No alert changes

Improved metrics

Total package byte prevSize

9428

increased by11.6%

Number of lines in readme file

192

increased by36.17%

No dependency changes