Skip to content

kah3vich/Gulp-RS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

16 Commits
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation


script

One of the current and developing assemblies for Gulp. With support for current versions Gulp 4 and Webpack 5. The main idea of the assembly is to simplify and speed up the layout process. For this, a flow was implemented:

  1. Full generation custom components and font files.

  2. The assemblies use the architecture of components and for them scripts were released for quickly creating, connecting to certain paths in the architecture and deleting a component.

  3. Optimization of assembly processing, the main load and data processing falls on the project build. Thanks to this, the start of the project is carried out an order of magnitude quickly.

  4. Simplified architecture of the assembly itself Gulp . Thanks to which you yourself can supplement or customize the assembly according to your requirements.


script

Clone repository:

git clone https://github.com/kah3vich/Gulp-RS.git -b [branch]

Branch's:

master - informative thread for general acquaintance with the project.

set - assembly only, no extras.

font - various fonts for sharing.

refs - examples and blanks ( beta ).

package - custom build package ( beta ).


script

Install base packages:

npm i -g gulp gulp-cli webpack webpack-cli; yarn

script

Install dependencies:

yarn

Start dev mode:

yarn start

Build project:

yarn build

Build project in ZIP:

yarn build:zip

Component create:

yarn component:create [name] [path]

Component remove:

yarn component:remove [name] [path]

Check lint:

yarn lint:script

Check prettier:

yarn prettier:write

script

└── gulp-rs/
    |
    β”œβ”€β”€ .github/ - config file to upload to github
    |
    β”œβ”€β”€ .husky/ - precommit system
    |   └── pre-commit - configure scripts on commit
    |
    β”œβ”€β”€ custom/ - custom build functionality
    |   β”œβ”€β”€ command.js - script functions for the terminal
    |   β”œβ”€β”€ component.js - functions for working with components
    |   └── utils.js - various utils for working with custom functions
    |
    β”œβ”€β”€ gulp/ - gulp build folder
    |   β”œβ”€β”€ config/ - configuration data
    |   |   β”œβ”€β”€ constant.js - static data
    |   |   β”œβ”€β”€ path.js - paths for different sections in assemblies
    |   |   └── plugins.js - build plugin imports
    |   β”œβ”€β”€ tasks/ - basic functions to work gulp
    |   |   β”œβ”€β”€ favicon - create favicon
    |   |   β”œβ”€β”€ fonts - create style and formatted for fonts
    |   |   β”œβ”€β”€ html - convert to html
    |   |   β”œβ”€β”€ image - optimization image
    |   |   β”œβ”€β”€ reset - remove style font
    |   |   β”œβ”€β”€ script - processing and optimization javascript
    |   |   β”œβ”€β”€ scss - convert to css
    |   |   β”œβ”€β”€ server - start local server to work
    |   |   β”œβ”€β”€ svg - processing and optimization svg icon
    |   |   └── zip - build to zip archive
    β”œβ”€β”€ public/ - assembled project
    |   β”œβ”€β”€ css/ - collected files css style
    |   β”œβ”€β”€ fonts/ - collected files fonts
    |   β”œβ”€β”€ img/ - collected files images
    |   β”œβ”€β”€ js/ - collected files javascript
    |   β”œβ”€β”€ svg/ - collected files svg
    |   └── *.html - file page
    β”œβ”€β”€ src/ - main development folder
    |   β”œβ”€β”€ components/ - component folder
    |   |   β”œβ”€β”€ Header/ - component structure example
    |   |   |   β”œβ”€β”€ index.pug - main component file for html
    |   |   |   β”œβ”€β”€ mixin.pug - file for mixins of this component
    |   |   |   β”œβ”€β”€ script.js - script file for this component
    |   |   |   └── styles.scss - style file for this component
    |   β”œβ”€β”€ fonts/ - font folder
    |   |   └── FONT - each font has its own folder with a key name without spaces in the name
    |   β”œβ”€β”€ img/ - photo folder
    |   β”œβ”€β”€ import/ - connection folder
    |   |   └── index.pug - imports for html with cdn
    |   β”œβ”€β”€ js/ - folder for scripts ( javascript )
    |   |   └── app.js - main file script
    |   β”œβ”€β”€ layout/ - wrapper over pages or blocks
    |   |   └── default.pug - default layout
    |   β”œβ”€β”€ pages/ - folder for pages
    |   |   └── index.pug - main file page
    |   β”œβ”€β”€ scss/ - style folder
    |   |   β”œβ”€β”€ fonts.scss - auto-generated stylesheet for fonts
    |   |   β”œβ”€β”€ mixin.scss - global file for style mixins
    |   |   β”œβ”€β”€ style.scss - global style file
    |   |   └── variable.scss - variable for styles
    |   └── svg/ - folder for svg icon
    β”œβ”€β”€ .browserslistrc - config file for server gulp
    β”œβ”€β”€ .csscomb.json - config file for csscomb css
    β”œβ”€β”€ .editorconfig - config file for editconfig css
    β”œβ”€β”€ .eslintigrone - setting for ignored refactoring and code review files
    β”œβ”€β”€ .eslint - refactoring and code review
    β”œβ”€β”€ .gitignore - ignored files for git
    β”œβ”€β”€ .prettierignore - setting for ignored format files
    β”œβ”€β”€ .prettier - code formatting
    β”œβ”€β”€ .yarnrc.yml - package manager setup yarn
    β”œβ”€β”€ babel.config.json - import package babel for webpack
    β”œβ”€β”€ gulpfile.js - the main assembly file, running and processing all logic
    β”œβ”€β”€ jsconfig.json - config file for javascript
    β”œβ”€β”€ license - base license
    β”œβ”€β”€ package.json - info packages
    β”œβ”€β”€ readme.md - description project
    β”œβ”€β”€ version.json - temporary assembly version, needed to avoid the cache
    └── webpack.config.js - configuration file for working with scripts in gulp

script