Basic Frontend starter kit with HTML, Sass/CSS, jQuery, Bootstrap DevServer and BrowserSync. Using dev mode sync on multiple device, vendor split for external libraries and custom bootstrap components imports.
"start"
= dev mode with hot reloading and Browsery-Sync
"build:dev"
= buildpack without minifing
"build:prod"
= final prod buildpack
This is useful to sync the dev mode with other browsers or device if the Wi-Fi is the same for all device. Type the ip address shown in the terminal after running the dev mode.
Example: External: http://192.168.1.34:8100
In the config of this plugins you can set the port and the files under watch for live reloading (html, pug...).
You can import a single Bootstrap component in js file when needed: import "bootstrap/js/dist/carousel";
In this way there is no need to include the whole Bootstrap js and have a lighter vendor.js.
In _bootstrap.scss
you can import only the style components you need. This files are scss framgents imported directly from the node modules folder. This can be useful when are needed only some features from Bootstrap (example the layout/grid classes) without needing th include all the css rules.
To disable line : // eslint-disable-line
To disable the entire file console : // eslint-disable no-console
To disable a single line : // eslint-disable-line no-console
Webpack 4 causes issues with Extract Text Plugin. Use instead mini-css-extract-plugin