1.1.0 • Published 6 years ago
webpack_scss_babel_boilerplate v1.1.0
Webpack 4 Boilerplate with SASS, Babel, HTML
A boilerplate to start up your web development faster and easier. :rocket:
(Webpack 4 + HTML + SASS + Babel + ES6 + Livereload)
Requirements
node.js needs to be installed.
Feature
- Support Livereload
- Support syntax ES2015+
- Support browser cache busting on production mode
- Minify HTML and CSS on production mode
- Two settings for development mode and production mode
List of Packages and Modules
- Webpack v4.42.0
- Webpack Dev Server v3.10.3
- Babel(Core) v7.8.7
- Babel Loader v8.0.6
- HTML Loader v0.5.5
- CSS Loader v3.4.2
- Sass Loader v8.0.2
- Style Loader v1.1.3
- File Loader v5.1.0
- HTML Webpack Plugin v3.2.0
- Mini CSS Extract Plugin v0.9.0
- Clean Webpack Plugin v3.0.0
How to start
Clone this repo or Download a zip file
git clone git@github.com:Wangchimei/boilerplate-webpack-scss-babel.git(Re)initialize git
git initInstall the dependencies
npm install
Usage
Start a live reloading server in development
npm run serveBuild an application
- For development
npm run build:dev - For production
ornpm run buildnpm run build:prod
Remove files
- Remove development files
npm run clear:dev - Remove production files
npm run clear:prod - Remove both development and production files
npm run clear - Remove node_modules, development and production files
npm run clear:all
Install Bootstrap on the fly
Only import Bootstrap CSS styles
npm run set:bs:cssGo to main.scss and import Bootstrap
@import '~bootstrap';Bootstrap + jQuery + Popper.js
npm run set:bs:allGo to main.scss and import Bootstrap
@import '~bootstrap';Go to vendor.js and import Bootstrap
import 'bootstrap';Note: if you are okay with mixing your own js code with js from vendors, it is fine to put in
index.jsBy running the commands above, you will install:
- Bootstrap v4.4.1
- jquery v3.4.1
- popper.js v1.16.1
Uninstall Bootstrap / jQuery / Popper.js
npm run bs:clear