@misk/webpack

Microservice Kontainer Webpack Build Configs

Stats

stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
283104Jun 24, 2021Dec 4, 2017Minified + gzip package size for @misk/webpack in KB

Readme

Misk Webpack

This package provides shared Webpack build configs for use across Misk tab repos.

Getting Started

$ yarn add @misk/webpack

Webpack Child Template

Use the following template to consume the base Webpack config. Start by creating a file webpack.config.js in your repo main directory and copying in the following.

const { MiskWebpackConfigBase } = require("@misk/webpack")
const path = require('path')
const CopyWebpackPlugin = require('copy-webpack-plugin')

const MiskTabConfig = require(path.join(process.cwd(), "package.json")).miskTabWebpack
const RELATIVE_PATH = MiskTabConfig.relative_path_prefix

const CopyWebpackPluginConfig = new CopyWebpackPlugin(
  [
    { from: './node_modules/@misk/common/lib', to: `${RELATIVE_PATH}@misk/`},
    { from: './node_modules/@misk/components/lib', to: `${RELATIVE_PATH}@misk/`}
  ], 
  { debug: 'info', copyUnmodified: true }
)

module.exports = {...MiskWebpackConfigBase,
  output: { ...MiskWebpackConfigBase.output,
    filename: `${RELATIVE_PATH}/tab_${MiskTabConfig.slug}.js`,
    library: ['MiskTabs', `${MiskTabConfig.name}`],
  },
  devServer: { ...MiskWebpackConfigBase.devServer,
    port: MiskTabConfig.port
  },
  plugins: []
    .concat(MiskWebpackConfigBase.plugins)
    .concat([CopyWebpackPluginConfig])
}

Package.json Input Parameters

The child Webpack template above consumes some static initialization variables that you must add to your package.json. An example for the Config tab is included below.

  "devDependencies": {
    "@misk/dev": "^0.0.10"
  },
  "miskTabWebpack": {
    "name": "Config",
    "output_path": "dist",
    "port": "3200",
    "relative_path_prefix": "_tab/config/",
    "slug": "config"
  }

Releasing

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.