wcb v0.16.0

#+HTML: WCB Webpack Config builder [https://www.npmjs.org/package/wcb] [https://travis-ci.org/jupl/wcb] [https://codecov.io/gh/jupl/wcb] [https://david-dm.org/jupl/wcb] [https://david-dm.org/jupl/wcb?type=peer] [https://david-dm.org/jupl/wcb?type=dev]

** About Personal [https://webpack.js.org/] config builder, targeted specifically for [https://www.typescriptlang.org/].

** Installation #+BEGIN_EXAMPLE npm install typescript wcb webpack #+END_EXAMPLE

** Usage #+BEGIN_SRC typescript import {addToEntries, createConfiguration} from 'wcb' const base = createConfiguration() const tweaked = createConfiguration({ source: 'src', destination: 'dist', assets: 'assets', }) const extra = addToEntries(createConfiguration({ common: true, cssLoaders: [{test: /.css$/, use: 'css-loader'], }), 'dotenv/config', )

// webpack.config.ts import {createConfiguration} from 'wcb' export default createConfiguration() #+END_SRC

Environment Variables The following environment variables are available for things like DCE: * ~process.env.IS_CLIENT~ This is ~'true'~ if ~target~ is set to ~'web'~ or ~'webworker'~. Otherwise it is ~'false'~. Useful when using shared code. ~process.env.NODE_ENV~ This is read from the environment variable value set. Otherwise it is ~undefined~. ~process.env.WEBPACK_BUILD~ This is always set to ~'true'~. This can be used for cases like when writing code for Node and run development code outside of Webpack.

API * ~createConfiguration(options?: Options): Configuration~ Create a [https://webpack.js.org/concepts/configuration/] which can be used by a =webpack.config= file. ~addPlugins(configuration: Configuration, plugins: Plugin[]): Configuration~ Given an existing configuration from ~createConfiguration~, add [https://webpack.js.org/concepts/plugins/] easily. Please note that this will return a new configuration and does not modify the given configuration. ~addRules(configuration: Configuration, rules: Rule[]): Configuration~ Given an existing configuration from ~createConfiguration~, add [https://webpack.js.org/concepts/loaders/] easily. Please note that this will return a new configuration and does not modify the given configuration. ** ~addToEntries(configuration: Configuration, modules: string[]): Configuration~ Given an existing configuration from ~createConfiguration~, load additional Node files to each entry. Please note that this will return a new configuration and does not* modify the given configuration.

Options * ~assets: string | boolean = false~ Path that contains static files to copy over to the final build. Path is relative to ~process.cwd()~. The following occurs in order from top to bottom:

• If a custom string, that path is used
• If ~true~ then path from ~source~ is used
  • Source files that are built are ignored
• If ~false~ no static files are copied over ~assetsIgnore: string[] = pattern~ Glob patterns indicating files to ignore when using the ~assets~ option. By default it uses the ~pattern~ option. ~chunkFilename: string = filename~ [https://webpack.js.org/configuration/output/#output-chunkfilename] for JS/CSS. This is useful for [https://webpack.js.org/guides/caching/] strategies. DO NOT INCLUDE FILE EXTENSION. ~common: string | boolean = false~ If enabled and ~split~ is not enabled then a single file containing [https://webpack.js.org/plugins/commons-chunk-plugin/] will be included. This option is only use if a non-Node ~target~ is chosen and there are multiple entries to build. If value is ~true~ then name of file is called "common", whereas a string value allows a custom filename. ~cssLoaders: Loader[] = []~ List of CSS [https://webpack.js.org/configuration/module/#rule] to incorporate. =extract-text-webpack-plugin= is used by default, whereas =style-loader= is used for hot reloading. Do NOT use =extract-text-webpack-plugin= nor =style-loader= as it will automatically be included. ~destination: string = process.cwd()~ Path where generated JS files will be placed in final build. If path is relative, it is relative to ~process.cwd()~. ~devServer: boolean = false~ If enabled then configuration will include support for [https://webpack.js.org/configuration/dev-server/]. ~environment: 'development' | 'production' = process.env.NODE_ENV~ Environment to build under. ~filename: string = 'name'~ [https://webpack.js.org/configuration/output/#output-filename] for JS/CSS. This is useful for [https://webpack.js.org/guides/caching/] strategies. DO NOT INCLUDE FILE EXTENSION. ~html: boolean | string | object = false~ If non-false, then use [https://github.com/jantimon/html-webpack-plugin] to generate HTML files for each file from ~source~. If an object is provided, then you can overwrite [https://github.com/jantimon/html-webpack-plugin#options]. If a string then it is used as the ~template~ option in the plugin. ~hotReload: boolean = process.env.HOT_MODULES === 'true'~ If enabled then [https://webpack.js.org/concepts/hot-module-replacement/] will be enabled. If using =webpack-dev-server= then use the ~server~ option. Otherwise if using =webpack-dev-middleware= or similar then use the ~middleware~ option. ~log?: string | boolean~ If value is a string, then logging is done with the string value used as an identifier. ~pattern: string[] = '*/.ts{,x}'~ Glob patterns to pick up as entry points relative to ~source~. If you want to use JavaScript as entry points then instead of ~ts{,x}~ use ~{j,t}s{,x}~. ~source: string = process.cwd()~ Path where source files will be used for building. If path is relative, it is relative to ~process.cwd()~. ~split: boolean = false~ If true then split code as outlined [https://hackernoon.com/f8a9df5b7758]. *** ~sourceMaps?: Devtool~ [https://webpack.js.org/configuration/devtool/#devtool] option for source maps. By default the following occurs in order from top to bottom:
• If environment is ~'production'~ then ~false~
• If hot reload is ~true~ then ~'cheap-module-eval-source-map'~
• Otherwise then ~'source-map'~ ~target: string = 'web'~ [https://webpack.js.org/configuration/target/] to build to. ~typescript?: object | true~ If true or passed with options, include [https://github.com/s-panferov/awesome-typescript-loader]. ~paths: boolean = false~ If true then add support for paths option in tsconfig via [https://github.com/dividab/tsconfig-paths-webpack-plugin]. ~webpack?: object~ [https://webpack.js.org/configuration/#options] to start out with. This is an advanced option. Take care in which options are specified as this builder can override overlapping settings.