Personal webpack build.
npm install -D @robtucker/webpack-build
Includes the following environments:
- css modules
- hot module replacement
- concatenate js modules
- split vendor js in commons chunk
- minify js
- extracts and minify styles
Create webpack config file
Create a webpack config file,
webpack.config.js, in your project root and add the following:
const build = ;const webpackMerge = ;const custom =// your custom options go hereentry: "./src/app.tsx"moduleexports =
Create a .env file
You are expected to provide a
.env file which will be used at compile time to configure your app. A
.env.example file has been provided to demonstrate the format.
At the very beginning of the build process your .env file is loaded and parsed into json by the dotenv package. Webpack then uses the Define Plugin to make this object available inside your project as
If you are using typescript I highly recommend that you re-export this as a typed object:
Create a Handlebars template
If you are building for web, you must create an html file which represents the entry point of your app.
HtmlWebpackPlugin will add a bunch of stuff into your template, such as scripts, stylesheets, favicon, title etc... and then output your file as index.html.
Feel free to copy the demo provided in this repo.