Bắt đầu nhanh một dự án sử dụng Pug, Sass, Gulp

Overview

Quick start dự án Pug, Sass, Gulp

Bắt đầu nhanh một dự án sử dụng Pug, Sass, Gulp

#️⃣ Setup

  • Cài đặt Node js
  • Tới thư mục project cài template và các modules
@@ Sử dụng cmd @@

 git clone https://github.com/sangcamap/pug_sass_gulp_template
 

 npm install gulp-cli -g
 

 npm install
 

 gulp rmEmpty
 

#️⃣ Sử dụng

Command Chức năng
gulp styles build thư mục styles sass -> css
gulp views build thư mục views pug -> html
gulp scripts build thư mục scripts
gulp images build thư mục images và thu gọn ảnh
gulp fonts build thư mục fonts
gulp sounds build thư mục sounds
gulp videos build thư mục videos
gulp clean xóa thư mục public
gulp rmEmpty xóa các file empty.*
gulp build hoặc gulp build tất cả thư mục
gulp watch browsersync ở port 3000

#️⃣ Documentation

You might also like...

Gulp.js command execution for humans

Gulp.js command execution for humans

Gulp.js command execution for humans. As opposed to similar plugins or to child_process.exec(), this uses Execa which provides: Better Windows support

Dec 14, 2022

Builder: A gulp-like build system with modern JavaScript

Builder: A gulp-like build system with modern JavaScript What is this? This is a build system meant to automate tasks. At this point it’s merely a con

Mar 22, 2022

A simple CSS tooltip made with Sass

Simptip [v1.0.4] A simple CSS tooltip made with Sass Visit Site, Documentation and some examples Installation Install with npm, Yarn or Bower: npm: np

Dec 14, 2022

Sass makes CSS fun!

Sass makes CSS fun again. Sass is an extension of CSS, adding nested rules, variables, mixins, selector inheritance, and more. It's translated to well

Dec 31, 2022

Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects.

Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects.

Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects. inuitcss is a framework in its truest sense: it does not pro

Dec 30, 2022

Source code for Chrome/Edge/Firefox/Opera extension Magic CSS (Live editor for CSS, Less & Sass)

Live editor for CSS, Less & Sass (Magic CSS) Extension Live editor for CSS, Less & Sass (Magic CSS) for Google Chrome, Microsoft Edge, Mozilla Firefox

Dec 13, 2022

A Lightweight Sass Tool Set

A Lightweight Sass Tool Set Bourbon is a library of Sass mixins and functions that are designed to make you a more efficient style sheet author. It is

Dec 30, 2022

Rollup + React + Babel + Prettier + Strict ESlint and Stylelint + Sass + VSCode + Playground app - Enterprise grade boilerplate

React package boilerplate by HackingBay Rollup + React 17 + Babel + Prettier + Strict ESlint and Stylelint + Sass + VSCode + Playground app - Enterpri

Jan 19, 2022

Blog-sercannaya - react-next-sass-graphql

Next.js + Tailwind CSS Example This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind

Jan 3, 2022

A collection of CSS3 buttons implemented in Sass.

CSS3 Buttons This is a collection of buttons that show what is possible using CSS3 and other advanced techniques, while maintaining the simplest possi

Nov 8, 2022

A CSS button library built using Sass and Compass

Buttons 2.0 Buttons 2.0 Buttons is a highly customizable production ready mobile web and desktop css button library. Buttons is a free open source pro

Jan 4, 2023

Math Magicians - A calculator and three subpages built with React + SASS

Math Magicians - A calculator and three subpages built with React + SASS

Math Magicians JavaScript application that contains a calculator and three sub-pages. Built with React + SASS. Built With JavaScript HTML5 SASS React.

Mar 23, 2022

A recipe website built for my girlfriend who loves cooking, using Sass, JavaScript, Parcel, and HTML

A recipe website built for my girlfriend who loves cooking, using Sass, JavaScript, Parcel, and HTML

Forkify-App Live Link Project Introduction Forkify is a recipe web app using the Forkify API to allow users to search, view, modify, bookmark and add

Sep 29, 2022

💅 A ready-to-go with a well-thought-out structure Electron app boilerplate with ReactJS, TypeScript, CSS / SASS modules, SWC, Eslint, Prettier, GitHub Action releases and more.

💅 A ready-to-go with a well-thought-out structure Electron app boilerplate with ReactJS, TypeScript, CSS / SASS modules, SWC, Eslint, Prettier, GitHub Action releases and more.

Electron App 💅  A ready-to-go with a well-thought-out structure Electron app boilerplate with ReactJS, TypeScript, CSS / SASS modules, SWC, Eslint, P

Dec 29, 2022

Rent-A Movie is a website based on movie renting. The user can leave likes, comments or make reservations for movies they would like to rent. Made using tvMaze API, Involvement API, HTML, SASS and JavaScript

Rent-A Movie is a website based on movie renting. The user can leave likes, comments or make reservations for movies they would like to rent. Made using tvMaze API, Involvement API, HTML, SASS and JavaScript

Rent-A Movie "Rent-A Movie" is a website for movie renting where you can make reservations, add comments & likes or just get details about movies that

Aug 23, 2022

ThinkMore Forum frontend build with Next.js, Typescript, Redux, Jest, Sass, MUI.

 ThinkMore Forum frontend build with Next.js, Typescript, Redux, Jest, Sass, MUI.

ThinkMoreForum-Frontend Website Desktop Mobile Front-end technology stack Next.js Redux Typescript MUI Axios Husky React testing-library Jest Eslint,

Dec 10, 2022

Convert css (scss/sass) to vanilla-extract.

CSS-to-vanilla-extract ⚡ Welcome 😀 Convert CSS (SCSS/SASS) to vanilla-extract. playground Install npm i -D c2ve Usage Once installed, you can run it

Jan 4, 2023

Next.js + TypeScript + Material UI v5 + Sass + Storybook starter

Next.js + TypeScript + Material UI v5 + Sass + Storybook starter

nextjs-ts-mui5-scss-storybook-starter 📕 Next.js + TypeScript + Material UI v5 + Sass + Storybook starter 📕 with linting & prettier pre-configured Ma

Oct 19, 2022
Owner
Nguyễn Quang Sang
UITの三年生です。
Nguyễn Quang Sang
Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects.

Extensible, scalable, Sass-based, OOCSS framework for large and long-lasting UI projects. inuitcss is a framework in its truest sense: it does not pro

inuitcss 1.8k Dec 30, 2022
Source code for Chrome/Edge/Firefox/Opera extension Magic CSS (Live editor for CSS, Less & Sass)

Live editor for CSS, Less & Sass (Magic CSS) Extension Live editor for CSS, Less & Sass (Magic CSS) for Google Chrome, Microsoft Edge, Mozilla Firefox

null 210 Dec 13, 2022
A Lightweight Sass Tool Set

A Lightweight Sass Tool Set Bourbon is a library of Sass mixins and functions that are designed to make you a more efficient style sheet author. It is

thoughtbot, inc. 9.1k Dec 30, 2022
A collection of CSS3 buttons implemented in Sass.

CSS3 Buttons This is a collection of buttons that show what is possible using CSS3 and other advanced techniques, while maintaining the simplest possi

Chad Mazzola 1.3k Nov 8, 2022
A CSS button library built using Sass and Compass

Buttons 2.0 Buttons 2.0 Buttons is a highly customizable production ready mobile web and desktop css button library. Buttons is a free open source pro

Alex Wolfe 5.1k Jan 4, 2023
Convert css (scss/sass) to vanilla-extract.

CSS-to-vanilla-extract ⚡ Welcome ?? Convert CSS (SCSS/SASS) to vanilla-extract. playground Install npm i -D c2ve Usage Once installed, you can run it

j1ngzoue 31 Jan 4, 2023
An NPM package to help frontend developers get started with using SASS and SCSS on your project easily. The Package follows the 7-1 architecture project structure.

Project Title - Create SASS APP Ever wanted to code up a frontend project with SASS & SCSS and you are stuck with building the acclaimed 7-1 architect

Kelechi Okoronkwo 7 Sep 22, 2022
⚙️ Static site boilerplate. Using Gulp, PugJS, and Sass.

?? Alaska | Static-site Boilerplate ⚡ Fastest way to build HTML and CSS static sites. You don't have to learn complicated tools to build simple websit

Alaska Labs 8 Sep 10, 2022
Pug – robust, elegant, feature rich template engine for Node.js

Pug Full documentation is at pugjs.org Pug is a high-performance template engine heavily influenced by Haml and implemented with JavaScript for Node.j

Pug 21.1k Dec 30, 2022
Generates documentations for pug.js mixins and blocks.

pug-doc-generator Generates documentation files for pug.js mixins, blocks and more. How to use All mixins with comments starting with the @pugdoc mark

Ofertório 3 Apr 21, 2022