A template to start a website with Gulp
Go to Node website.
npm install
gulp watch
It will install the dev dependencies and launch the web server with browser sync.
In src
, you will :
copy
: contains all the files like.html
, the manifest and your content images. By default, it also contains the Favicon generator template.js
: all your javascript.sass
: all your SCSS/SASS/CSS. By default, there is no SCSS or SASS code even if the files are named.scss
. I have not yet learned those and I'm still writing vanilla CSS.
The gulp file is inspired from Chris Ferdinandi's post. I have altered the script to include Font Awesome Pro 5.
npm init
and fill the inputs.
Go to Gulp getting started.
npm install --save-dev gulp
npm install --save-dev browser-sync
npm install --save-dev del
npm install --save-dev gulp-header
npm install --save-dev gulp-rename
npm install --save-dev gulp-flatmap
npm install --save-dev lazypipe
npm install --save-dev gulp-jshint
npm install --save-dev jshint
npm install --save-dev jshint-stylish
npm install --save-dev gulp-concat
npm install --save-dev gulp-terser
npm install --save-dev gulp-optimize-js
npm install --save-dev gulp-sass
npm install --save-dev gulp-postcss
npm install --save-dev autoprefixer
npm install --save-dev cssnano
npm install --save-dev gulp-svgmin
Create a .npmrc
file with the following content:
@fortawesome:registry=https://npm.fontawesome.com/
//npm.fontawesome.com/:_authToken=${FONTAWESOME_NPM_AUTH_TOKEN}
Then run FONTAWESOME_NPM_AUTH_TOKEN=YOUR_FA_TOKEN npm install --save @fortawesome/fontawesome-pro
.
You can find the token on your Font Awesome account under Pro npm Package Token
section.
If any issue arise, checkout Font Awesome website.