pug convert html, sass transformation scss

Sass converted SCSS need to install environment

1, first make sure you have ruby

gem install sass

PUG need to install the conversion of HTML environment

1, first install the node.js

npm install -g pug 
npm install -g pug-cli

Convert to SCSS Sass

//一般命令
$ sass-convert Before.sass After.scss
(可指定目录生成SCSS文件)--一下转换Sass和CSS用法一样
//指定目录生成SCSS文件
$ sass-convert style.sass C:\Users\admin\ceshi\style.scss

Convert to SCSS Sass

$ sass-convert Before.scss After.sass

Convert Sass to CSS

$ sass --watch Before.scss:After.css

The pug is converted to HTML (HTML to generate the current directory)

$ pug -P test.pug

The pug conversion (specified directory can be generated html) as html

实例：
$ pug -P test.pug -o C:\Users\admin\ceshi

Creating React project (called my-app)

1、cnpm install -g create-react-app          #快速构建 React 开发环境
2、create-react-app my-app               #创建项目
3、cd my-app/                            #进入创建项目文件夹
4、npm start                             #启动项目，浏览器打开(http://localhost:3000)测试

React whole directory structure

node_modules: contains some components react in the project will be used
** public: ** which contains the start page of our project (the main portal page index.html)
** src: ** which contains some of our own use js files, css files, img files, etc. (the default index.html pointed index.js, index.js is our entrance js, he and corresponding index.html)
package.json: project profile
Note: React support scss and css, sass must first be converted to scss, does not support pug, pug file format must first be converted to html format

React Scss introduced in Sass and
1, the installation environment

  npm install node-sass sass-loader --save

2, when the file is required to use the command Sass sass-convert Before.sass After.scss Scss converted file
to the introduction of import './index.scss' file in index.js

3, the file may be introduced import './index.scss' index.js file is in direct Scss

4, pug files into html files

# Command can be used directly to convert pug html (html generated in the current directory)

  		     $ pug -P test.pug

  		     # 将 pug 转换为 html(可指定目录生成html)
  		     实例：
  		     $ pug -P test.pug -o C:\Users\admin\ceshi   
   注意：此命令不可批量转换