Default Template

Webpack 5 + Vue 3 + Less + JEST + PostCSS

Install

1. Clone repository:
   
   • HTTPS: git clone https://github.com/osipovsergey/default_template.git name_your_folder
     
   • SSH: git clone git@github.com:osipovsergey/default_template.git name_your_folder
2. Go to project folder:
   
   • cd name_your_folder
3. Install npm-packages:
   
   • npm i

Run project

1. Dev mode:
   • npm run dev
     PORT: 8080
     
2. Production mode
   • npm run build

Test

Framework "JEST" is used to test .vue and .js, .json files.

1. Run test:
   
   • NPM: npm run test
2. Test generate coverage reports in "coverage" folder.

Mixins for LESS and Vue <style>

• mixins.less -- main file for import file with mixins;
• colors.less -- mixins for colors
  
• fonts.less -- mixins for fonts
  
• media_queries.less -- mixins for media-queries;
  

Webpack Bundle Analyzer

1. Create folder stats: mkdir stats
   
2. Generate stats file for Webpack Bundle Analyzer: npm run genstats
   
3. Watch stats bundles: npm run watchstats
   

or

When building a project: npm run build and automatically open page with stats.

Note

This project is open source.
Feedback and suggestions write to the issue.

P.S. This repository helped me in setting up the webpack. Thanks!

Author:

• Sergey Osipov