Rejoin comes with power of SCSS. The css files can be generated from scss by simply following below steps:
Gulp is a JavaScipt streaming task runner. It automate many development tasks. Using gulp you can perform tasks like running a local server, minifying code, compilation, Browser sync ,optimizing images, etc... We are using gulp which allows to easily compilation of scss to csss. You can read it more about it here.
Please follow below steps to install and setup all prerequisites:
Make sure to have the Node.js installed & running in your computer. If you already have installed nodejs on your computer, you can skip this step, otherwise install nodejs on your computer,
Note : If you are using the latest version of Node JS or want to install and use the latest version, click here and install all the dependencies manually that are given below in command prompt.
Make sure to have the Gulp
installed &
running in your computer. If you already have installed gulp on your
computer, you can skip
this step. In order to install, just run command
npm install -g gulp from
your terminal.
After Completion of gulp Install. open gulpfile.js And install
the "Declaration of gulp variables" in your command promt. In order to
install, just run command npm install gulp,
npm install gulp-sass,
npm install gulp-postcss,
npm install autoprefixer,
npm install gulp-sourcemaps,
npm install browser-sync,
npm install gulp-cssbeautify,
npm install gulp-beautify from your terminal.
Make sure to have all above prerequisites installed & running in your
computer. If you want to install more variables for your template, just
declare the variables in gulpfile.js after that run in command
promt
To setup, follow below mentioned steps:
Make sure to have all above prerequisites installed & running in your computer
Open your terminal, go to your folder and enter the command
npm install. This
would install all required dependencies in node_modules folder.
After you finished with above steps, you can run the command to compile
scss into css:
gulp
Note:- Please ensure that you have installed all nodemodules requried to run gulp tasks .
| Command | Description |
|---|---|
gulp watch
|
In this template gulp watch command is for what ever changes made in scss
folder, will watch and run an appropriate task.
All the CSS files under assets/css/ folder will be watched and
upon changes made to these files, the styles task will be executed.
|
gulp dark
|
In this template gulp dark command is for what ever changes are made in dark-style.scss will be watched and the changes automatically updated in dark-style.css file in css folder.
|
gulp admin
|
In this template gulp admin command is for what ever changes
are made in admin-custom.scss will be watched and the changes
automatically updated in admin-custom.css file in css folder.
|
gulp color10
|
In this template gulp color10 command is for what ever changes are made in color10.scss will be watched and the changes automatically updated in color10.css file in css folder.
|
gulp transparent
|
In this template gulp transparent command is for what ever changes are made in transparent-style.scss will be watched and the changes automatically updated in transparent-style.css file in css folder.
|
gulp default
|
In this template gulp default command is for what ever changes made in .scss files will be watched and the changes automatically updated in .css files in css and plugins folder.
|
All plugins are changed into scss files in plugins folder in their respective folder. What ever changes have been done in plugins **.scss files will be changed and automatically generates in their respective folders