https://github.com/danjohnsonnj/touch-manager

https://github.com/danjohnsonnj/touch-manager

Last synced: 12 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/danjohnsonnj/touch-manager
• Owner: Danjohnsonnj
• Created: 2019-09-23T02:09:27.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2022-12-10T03:21:56.000Z (about 2 years ago)
• Last Synced: 2024-11-21T14:58:41.656Z (2 months ago)
• Language: JavaScript
• Size: 841 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 15
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ES6 Boilerplate with LESS

This is a very basic boilerplate which uses __webpack 4__ and __Babel 6__ to build the JavaScript. This makes it quite easy to configure, since __webpack 4__ needs almost no configuration out of the box, other than the __Babel__ loader, and __Babel__ has made things quite a bit easier with their *env* presets, too.

Since my [company](https://squarespace.com) uses __LESS__ as a CSS pre-processor, I've become quite used to it, so I included *less* and *less-watch-compiler* to handle the conversion. I also want all of the source files to be located in a single directory (*src*, natch) so I've included *cpx* to handle moving the HTML into *dist*, the target for the LESS compiler and __webpack__.

Though I **_did not include any web server_** -- since I like VS Code's [Live Server extension](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) -- the NPM scripts do include *watch* functionality to make it even easier to see the changes. Speaking of which:

## NPM Scripts

### The ones you'll use

* `dev` - compile the LESS and copy to *dist*, copy the HTML to *dist*, and run webpack in *development* mode

* `build` - compile the LESS and copy to *dist*, copy the HTML to *dist*, and run webpack in *production (uglified)* mode

* `watch` - compile the LESS and watch, copy the HTML to *dist* and watch, and run webpack in *development* mode, watching for changes

### The ones used by the ones you'll use

* `copy` - move HTML files to *dist*

* `copy:watch` - move HTML files to *dist* and rerun on changes

* `styles` - compile the LESS to CSS and copy to *dist*

* `styles:watch` - compile the LESS to CSS, copy to *dist*, and rerun on changes