Webpack + Nunjucks boilerplate for static websites that has all the necessary modern tools and optimizations built-in.
- Webpack
- Nunjucks (supports multiple pages)
- Babel
- TypeScript (disabled by default)
- ESLint
- Sass
- PostCSS
- StyleLint
- SVG Sprite
# Clone repository
git clone https://github.com/alsolovyev/webpack-boilerplate.git project-name
# Navigate to the project directory
cd project-name
# Install dependencies
yarn # npm install
# Run webpack-dev-server and let the magic happen
yarn start # npm start
# Build the project from sources
yarn build # npm run-script build
# Deploy the dist folder to GitHub pages
yarn deploy
serve
- run thewebpack-dev-server
build
- build the projectdeploy
- deploy thedist
folder to GitHub Pages
By default, TypeScript support is disabled. To enable it, set the TS_SUPPORT
environment variable to true
in package.json
.
... TS_SUPPORT=true ...
Just create nunjucks files in src
folder
┣━ js
┣━ njk
┣━ sass
┣━ home.njk
┣━ page1.njk
┣━ page2.njk
Just import SCSS files with extension:
// app.sass
// ...
@import common
@import another.scss
// ...
- Import SVG icon
// src/js/dev/icons.js
import '@/icons/github.svg'
- Use this icon in your template
// *.njk z
{{ icon('github', 'custom-class-name') }}
Type:
'development' | 'production' | none
Default:'development'
Indicates the current mode.
Type:
string
Default:'dist'
Indicates the directory where the production build files will be generated.
Type:
string
Default:'/'
Indicates the base URL your project bundle will be deployed at.
Type:
string
Default:'src'
Indicates the directory where the source files are located.
Type:
'true' | 'false' | none
Default:none
Indicates whether TypeScript support should be enabled.
none
is equal to false
-
Have a cup of tea -
Clear the terminal screen(c73fd0) -
Enable ESLint for TypeScript files(c27e7b) -
Run loaders in a worker pools(daee75) -
Run TypeScript type checker on a separate process(534c0b) -
Disable TypeScript support by default(e7c659) -
Replace simple-nunjucks-loader with custom loader(b05607) -
Add nunjucks functions and filters(90e877) -
Fix ERR_OSSL_EVP_UNSUPPORTED error(8fd0c5) -
Fix StylelinkPlugin #19(#20) - Optimize njk-loader code
- Enable caching
- Add native OS notifications
-
Nunjucks
-
JavaScript
-
TypeScript
-
CSS
-
Assets
-
SVG
-
Optimization
-
HTML
-
TypeScript
-
CSS
-
Eslint
-
Stylelint
-
Terminal
-
Git
-
Code
This project is licensed under the MIT License