feat: Enable to define baumeister config in package.json (#270)

You are now able to choose to store your settings either in a file called `baumeister.json` (respectively `.baumeister.json`) or in a `baumeister` key in your `package.json` file.

Closes: #246

README.md

@@ -120,9 +120,9 @@ npm install
 
 npm will look at the `package.json` file and automatically fetch and install the necessary local dependencies needed for our build workflow as well as the required frontend dependencies to a `node_modules` directory.
 
-### Adjust settings via the Baumeister config file
+### Adjust settings via the Baumeister configuration file
 
-In the root directory is a file named `baumeister.json` which can be used to change the most important settings without touching any webpack config:
+You can change the most important settings without touching any webpack config by editing Baumeisters JSON based configuration. You are free to choose to store your settings either in a file called `baumeister.json` (respectively `.baumeister.json`) or in a `baumeister` key in your `package.json` file.
 
 ```json
 {
@@ -177,7 +177,7 @@ If you want to provide constants for different types of builds, you can define t
 
 The plugin does a direct text replacement, so the value given to it must include actual quotes inside of the string. You can use alternating quotes, like `"'My value'"`, or use `JSON.stringify('My value')`.
 
-This is very useful to change the behavior between development and production build. For example adapting the URL prefix to an API. This is why we have predefined the constant `PRODUCTION` in `baumeister.json`.
+This is very useful to change the behavior between development and production build. For example adapting the URL prefix to an API. This is why we have predefined the constant `PRODUCTION` in [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file).
 
 You may take a look at the official [webpack DefinePlugin docs](https://webpack.js.org/plugins/define-plugin/).
 
@@ -238,7 +238,7 @@ Baumeister acts like a static site generator by default. Using handlebars we can
 
 Using Handlebars instead of plain HTML is fully optional and will probably suit your needs if you use Baumeister for creating a static site. If you are developing a single page application instead it would be a good idea to turn off handlebars compiling, place an `index.html` file in the `/src` directory, and store additional templates in `/src/app`.
 
-In this case you have to switch off Handlebars compiling in `baumeister.json`:
+In this case you have to switch off Handlebars compiling in [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file):
 
 ```javascript
 /**
@@ -553,7 +553,7 @@ myProject
 
 ### Bundling CSS from dependencies
 
-If a used library ships its own CSS you have to include the paths to the files you like to bundle in the `vendor.bundleCSS` section of your `baumeister.json` to add the CSS to the `vendor.bundle.css` file. Please note that glob pattern matching is supported over here.
+If a used library ships its own CSS you have to include the paths to the files you like to bundle in the `vendor.bundleCSS` section of your [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file) to add the CSS to the `vendor.bundle.css` file. Please note that glob pattern matching is supported over here.
 
 ```
 "vendor": {
@@ -578,7 +578,7 @@ myProject
 ### Including static files from dependencies
 
 Sometimes you need to copy static files from an npm package to your project. This may be fonts or JavaScript files you need to include via separate `<script>` tags.
-To handle that you have to include the files in the `vendor.includeStaticFiles` section of your `baumeister.json`. Please note that glob pattern matching is supported over here.
+To handle that you have to include the files in the `vendor.includeStaticFiles` section of your [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file). Please note that glob pattern matching is supported over here.
 
 ```
 "includeStaticFiles": [
@@ -719,7 +719,7 @@ Besides that, you might want to tweak settings to get an even better performance
 
 We are using [PurifyCSS](https://github.com/purifycss/purifycss) to remove unused selectors from your CSS. This is fully optional and is turned off by default.
 
-To activate PurifyCSS set the `usePurifyCSS` option in within `baumeister.json` to `true`.
+To activate PurifyCSS set the `usePurifyCSS` option in within [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file) to `true`.
 
 In addition you can define a PurifyCSS `whitelist` defining an array of selectors that should not be removed.
 
@@ -739,7 +739,7 @@ We’ve set up webpack to store the webpack runtime in an separate file to impro
 
 #### Deactivate cache busting
 
-You can disable hash based file name revving by setting the `cacheBusting` property within `baumeister.json` to `false`.
+You can disable hash based file name revving by setting the `cacheBusting` property within [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file) to `false`.
 
 ### Selective JavaScript imports
 
@@ -785,7 +785,7 @@ But we totally recommend you to give this workflow a chance, because it’s just
 
 Adding banners on top of the production bundles is fully optional and is turned off by default.
 
-It can be enabled with setting the `generateBanners` property within `baumeister.json` to `true`.
+It can be enabled with setting the `generateBanners` property within [`baumeister.json`](#adjust-settings-via-the-baumeister-configuration-file) to `true`.
 
 ```javascript
 /**

build/config.js

@@ -1,14 +1,25 @@
-const configFile = require('../baumeister.json');
+import path from 'path';
+import cosmiconfig from 'cosmiconfig';
+import logSymbols from 'log-symbols';
+import chalk from 'chalk';
 
-/**
- * Boolean flag to set when using handlebars instead of plain HTML files in `src`.
- */
-export const { useHandlebars } = configFile;
+const explorer = cosmiconfig('baumeister', {
+  searchPlaces: ['package.json', '.baumeister.json', 'baumeister.json']
+});
 
-/**
- * Flag for generating banners on on top of dist files (CSS & JS).
- */
-export const { generateBanners } = configFile;
+export const userSettings = explorer.searchSync(path.resolve(__dirname, '../'));
+
+if (userSettings === null) {
+  console.log(
+    logSymbols.error,
+    `${chalk.red.bold('error')} – No Baumeister config found`,
+    '\n\n',
+    chalk.yellow(
+      'Please see the <https://github.com/micromata/Baumeister> for info regarding the configuration file.'
+    )
+  );
+  process.exit(1);
+}
 
 export const mainDirectories = {
   dev: '../server/',

build/handlebars.js

@@ -12,7 +12,11 @@ import globby from 'globby';
 import perfy from 'perfy';
 import { stripIndents } from 'common-tags';
 
-import { settings, useHandlebars } from './config';
+import { settings, userSettings } from './config';
+
+const {
+  config: { useHandlebars }
+} = userSettings;
 
 perfy.start('build', false);
 

build/webpack/config.entry.js

@@ -1,18 +1,18 @@
 import path from 'path';
 import globby from 'globby';
-import { settings } from '../config';
+import { settings, userSettings } from '../config';
 
-const configFile = require('../../baumeister.json');
+const { config: userConfig } = userSettings;
 
 export const entry = {
   app: `${path.join(__dirname, '../../', settings.sources.app)}index.js`,
   ...getVendorCSS()
 };
 
 function getVendorCSS() {
-  // Return flattened array of resolved globs from baumeister.json
+  // Return flattened array of resolved globs from Baumeister user config.
   const vendorCSS = [].concat(
-    ...configFile.vendor.bundleCSS.map(glob =>
+    ...userConfig.vendor.bundleCSS.map(glob =>
       globby.sync(`./node_modules/${glob}`)
     )
   );

build/webpack/config.module.rules.js

@@ -1,10 +1,10 @@
 import path from 'path';
 import MiniCssExtractPlugin from 'mini-css-extract-plugin';
 
-import { settings } from '../config';
+import { settings, userSettings } from '../config';
 import { isDevMode } from './helpers';
 
-const configFile = require('../../baumeister.json');
+const { config: userConfig } = userSettings;
 
 export const rules = [
   {
@@ -31,7 +31,7 @@ export const rules = [
           sourceMap: isDevMode(),
           config: {
             ctx: {
-              usePurifyCSS: configFile.purifyCSS.usePurifyCSS,
+              usePurifyCSS: userConfig.purifyCSS.usePurifyCSS,
               cssnano: {
                 discardComments: {
                   removeAll: true

build/webpack/config.output.js

@@ -1,17 +1,17 @@
 import path from 'path';
-import { mainDirectories } from '../config';
+import { mainDirectories, userSettings } from '../config';
 import { isDevMode } from './helpers';
 
-const configFile = require('../../baumeister.json');
+const { config: userConfig } = userSettings;
 
 export const output = {
   path: isDevMode()
     ? path.join(__dirname, '../', mainDirectories.dev)
     : path.join(__dirname, '../', mainDirectories.prod),
-  filename: configFile.cacheBusting
+  filename: userConfig.cacheBusting
     ? 'app/[name].[chunkhash].bundle.js'
     : 'app/[name].bundle.js',
-  chunkFilename: configFile.cacheBusting
+  chunkFilename: userConfig.cacheBusting
     ? 'app/[name].[chunkhash].bundle.js'
     : 'app/[name].bundle.js',
   publicPath: '/'

build/webpack/config.plugins.js

@@ -8,17 +8,18 @@ import PurifyCSSPlugin from 'purifycss-webpack';
 import ImageminPlugin from 'imagemin-webpack-plugin';
 import MiniCssExtractPlugin from 'mini-css-extract-plugin';
 
-import { generateBanners, settings, useHandlebars } from '../config';
+import { settings, userSettings } from '../config';
 import { isDevMode, isProdMode } from './helpers';
 
 const pkg = require('../../package.json');
-const configFile = require('../../baumeister.json');
+
+const { config: userConfig } = userSettings;
 
 const manifest = new WebpackAssetsManifest({
   output: path.resolve('.webpack-assets.json')
 });
 
-const copyVendorFiles = configFile.vendor.includeStaticFiles.map(glob => {
+const copyVendorFiles = userConfig.vendor.includeStaticFiles.map(glob => {
   return {
     from: glob,
     context: 'node_modules',
@@ -31,7 +32,7 @@ const purifyCSSOptions = {
   purifyOptions: {
     minify: true,
     cleanCssOptions: { level: { 1: { specialComments: 0 } } },
-    whitelist: configFile.purifyCSS.whitelist
+    whitelist: userConfig.purifyCSS.whitelist
   }
 };
 
@@ -42,15 +43,17 @@ const generalPlugins = [
   manifest,
   new MiniCssExtractPlugin({
     filename:
-      configFile.cacheBusting && isProdMode()
+      userConfig.cacheBusting && isProdMode()
         ? 'assets/css/[name].[chunkhash].bundle.css'
         : 'assets/css/[name].bundle.css'
   }),
-  new webpack.ProvidePlugin({ ...configFile.webpack.ProvidePlugin }),
+  new webpack.ProvidePlugin({ ...userConfig.webpack.ProvidePlugin }),
   new CopyWebpackPlugin([
     {
       from: '**/*.html',
-      context: useHandlebars ? settings.destinations.handlebars : './src',
+      context: userConfig.useHandlebars
+        ? settings.destinations.handlebars
+        : './src',
       transform(content) {
         return content
           .toString()
@@ -75,8 +78,8 @@ const generalPlugins = [
   ]),
   new webpack.DefinePlugin(
     isDevMode()
-      ? { ...configFile.webpack.DefinePlugin.development }
-      : { ...configFile.webpack.DefinePlugin.production }
+      ? { ...userConfig.webpack.DefinePlugin.development }
+      : { ...userConfig.webpack.DefinePlugin.production }
   )
 ];
 
@@ -91,10 +94,10 @@ const devPlugins = [];
 const prodPlugins = [
   new webpack.HashedModuleIdsPlugin(),
   new ImageminPlugin({ test: /\.(jpe?g|png|gif|svg)$/i }),
-  configFile.purifyCSS.usePurifyCSS
+  userConfig.purifyCSS.usePurifyCSS
     ? new PurifyCSSPlugin(purifyCSSOptions)
     : false,
-  generateBanners
+  userConfig.generateBanners
     ? new webpack.BannerPlugin({
         banner: stripIndents`${pkg.title} - v${pkg.version}
 		${pkg.author.email}