Webpack Starter Template
This website skeleton is build based on npm and Webpack. Modules are installed thrugh npm and later on all files are compiled through Webpack. I decided to keep the html files minimal and focused on making it flexible and
Before you install this template, you will need node and npm installed on your machine
In order to install the template, you have to navigate to the root of the project's folder in your terminal and then run:
At this point, npm should install all modules necessary to run this example. You can add/remove modules in the package.js file.
How this template works
Thanks to the use of Webpack and npm modules, there are lots of features you might want to incorporate into your web workflow:
- Development folder for building your app- /src
- Production folder for compiling the app- /dist
- Minification plugins to make your html/css/js files minified.
- Code documentation with JSDoc module.- /docs
- Jquery already included.
- Bootstrap included.
- Mustache.js enabled.
- Dist and Docs folders rebuild every time you run prod script
Development enviroment can be run by:
npm run dev
Once app compiles, you will be able to access the code by going to http://localhost:8080 in your browser.This command uses webpack-dev-server and doesn't write any new files to the disk. While webpack-dev-server runs, you can modify your css/js and html files. Localhost website you're working on will be refreshed every time you save your progress.
Deployment is as easy as running npm run dev command in your terminal window.
npm run dev
Packages and Modules
The goal of this template was to automate as many tedious "behind the scene" processes as possible. In order to understand development and deployment processes, take a look at project.json and webpack.config.js.
- (Michal Lichwa)[http://michallichwa.com]
This project is licensed under the MIT License - see the LICENSE.md file for details
- I used Academind Webpack Tutorial while creating this template.