site-boilerplate | A complete grunt site boilerplate | DevOps library
kandi X-RAY | site-boilerplate Summary
kandi X-RAY | site-boilerplate Summary
A complete site boilerplate for @andismith's personal projects.
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of site-boilerplate
site-boilerplate Key Features
site-boilerplate Examples and Code Snippets
Community Discussions
Trending Discussions on site-boilerplate
QUESTION
I'm currently learning webpack to improve my static site building process. I'm using a boilerplate called Static site boilerplate.
I have an issue with it since i'm not on point with webpack. At start, there is only one .js
file in the javascripts
folder called scripts.js
. What i'd like to do is add multiple files in this javascripts
folder and join them into one file only, the scripts.js
(like in Sass).
How can i do this?
Here is the webpack.config.js file :
...ANSWER
Answered 2019-Aug-14 at 23:46anything you import in an entry point file will be bundled by webpack into your final bundle, so in your entry JS file you can just import or require your other JS modules. you can even import your SCSS there and not have the SCSS entry point. have you been through the guides? https://webpack.js.org/guides/getting-started/
for instance, in a JS entry point:
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install site-boilerplate
Fork the repo
git clone https://github.com/andismith/site-boilerplate.git
cd site-boilerplate
Install project dependencies with npm install
Make sure you have the Grunt command-line interface with npm install -g grunt-cli
Install SASS 3.3.0.alpha.198 with gem install sass --pre for Source Maps
Run Grunt with grunt for development build, watch and server
Run Grunt with grunt [dev | prod] for development/production build
You can edit files directly in the browser in Chrome Canary. Canary shows the dist folder, but you can edit the src folder. Grunt will auto rebuild and LiveReload will load your changes.
Download Live Reload
Go to Chrome Flags
Enable Developer Tool Experiments, Restart
Go to Settings, and enable Sass stylesheet debugging
Restart developer tools
Go to General and Enable Source Maps
Go to Workspace and add the src folder
Go to Sources, right click a SASS or JS file and Enable Network Mapping
Close the developer tools
Start grunt
Turn on the Live Reload extension
Refresh the page and open developer tools
Edit CSS/JS to your hearts content
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page