@blunck/webpack-scripts

Opinionated webpack scripts

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
00Nov 6, 2019Nov 18, 2017Minified + gzip package size for @blunck/webpack-scripts in KB

Readme

webpack-scripts

Latest Version on NPM

Opinionated webpack scripts

Installation

npm install --save-dev @blunck/webpack-scripts

Add scripts to you package.json

{
    "scripts": {
        "start": "webpack-scripts start",
        "build": "webpack-scripts build",
        "profile": "webpack-scripts profile"
    }
}

Requirements

The webpack configuration expects the root of your project to contain a src directory with an index.js & index.html file:

src
  index.js
  index.html
package.json
.webpackrc

Configuration

Add a .webpackrc file to the root of your project. Following options are default:

{
    "framework": "vanilla",
    "host": "localhost",
    "port": 3000,
    "browser": "google chrome",
    "copy": null,
    "cssSourceMap": false,
    "alias": null,
    "zip": false,
    "bugsnagApiKey": null,
    "outputPath": "dist",
    "publicPath": "/",
    "sourceMaps": true,
    "gzip": true
}
  • framework Javascript framework that is used: "vanilla", "react" or "ng1"

  • port Port to start development server at

  • browser Browser to open development server in

  • copy Array of patterns to copy to outputPath. See Copy Webpack Plugin for more info

  • cssSourceMap Enable css / scss source maps (Causes style flash on initial load when running development server)

  • alias Create aliases to import or require certain modules more easily. See Webpack Documentation for more info

  • zip If true create zip archive with build artifacts with following name: PROJECT_NAME-GIT_COMMIT_HASH.zip

  • bugsnagApiKey If set upload source maps to bugsnag

  • outputPath The output directory relative to th .webpackrc file

  • publicPath Public URL of the output directory when referenced in a browser

  • sourceMaps Set to false to disable generation of js & css source maps

  • gzip Set to false to prevent js / css files from being gzipped

Scripts

Build

Build a production version of your application

npm run build

Start

Start a development server & re-compile / reload on changes. (HMR support for react)

npm run start

Profile

Build a production version of your application & open a page with information about your bundle.

npm run profile

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.