Link Search Menu Expand Document

Entry

  • desc: where does webpack go to begin building
  • default: ./src/index.js

Output

  • desc: where to emit
  • default: ./dist/main.js

Loaders

  • desc: allow webpack to process other files
module.exports = {
  output: {
    filename: 'my-first-webpack.bundle.js'
  },
  module: {
    rules: [
      { test: /\.txt$/, use: 'raw-loader' }
    ]
  }
};

Plugins

  • desc: everythign else
module.exports = {
  module: {
    rules: [
      { test: /\.txt$/, use: 'raw-loader' }
    ]
  },
  plugins: [
    new HtmlWebpackPlugin({template: './src/index.html'})
  ]
};

Mode

  • desc: optimize webpack for specific environments
  • syntax: development production none

Resolve

mainFields

src: https://webpack.js.org/configuration/resolve/#resolvemainfields

  • When importing from an npm package, e.g. import * as D3 from ‘d3’, this option will determine which fields in its package.json are checked. The default values will vary based upon the target specified in your webpack configuration.

=== Rest

disableHostCheck: bool

devtool

  • syntax:
    • inline-source-map: sourcemap is added as a dataurl to javascript file

loaders

node

link: https://webpack.js.org/configuration/node/

  • polyfills for mocks or node
    • This allows code originally written for the Node.js environment to run in other environments like the browser.
  • default:
module.exports = {
  //...
  node: {
    global: false,
    __filename: false,
    __dirname: false,
  }
};

debug

  • switch to debug mode

Copyright © 2020 Thence LLC