Skip to content
This repository has been archived by the owner on Jan 14, 2023. It is now read-only.

Webpack Launchpad is a small, easy-to-use and well-documented Webpack boilerplate for Webpack beginners. Use it to create your next amazing project!

License

Notifications You must be signed in to change notification settings

Rodrigoleon/Webpack-Launchpad

Repository files navigation

Webpack Launchpad

Welcome!

Webpack Launchpad is a small, easy-to-use and well-documented Webpack boilerplate for Webpack beginners. Use it to create your next amazing project or learn how to use Webpack.

Almost every line in Webpack Launchpad will be commented so that you can learn what each line is doing. You may play around with the code however you like, or use it as is to kick start (or, uh, provide a launchpad for) your own project.

Table of Contents

Launchpad Details

Status

Webpack Launchpad is ready for you to download! I am currently improving documentation, but aside from that, feel free to use it! As I find cool things (standards/best practices/new features), I will introduce them to Webpack Launchpad as this is an ongoing project!

Installation

Download or clone and npm install, thats it!

File Structure

The current file structure when the production of this boilerplate is built can be found below. This is configuration A (B may be coming in the future).

	App
	index.html
	- assets
	 - css
	  style.css
	 - js
	  app.js
	 - media
	  - fonts
	  - images
	  - vectors

What Launchpad Includes:

Webpack Features

Webpack Plugins

Webpack Loaders

Rules

PRs are welcome depending on what you are adding! Here are a few helpful points:

  • Please don't use ES6/ES2015 at this time unless necessary. There are a few bits on this project that uses ES6/ES2015 (since Webpack 2 and up supports it), but for the most part, keep it newbie friendly.
  • Use 4 space tab :P -- no, lets not add a file to handle that.
  • Keep it as light as possible! Only the essentials!
  • Document your code! Get really hand-holdy with it.
  • Make sure you are using the best and latest way to do whatever it is you are adding!
  • Please test your code!
  • Assume that your audience is learning JavaScript and Webpack.
  • Be nice! :)

TO DO

Repo

  • Add all to-do items to Github.
  • Start docs explaining code.
  • Logo maybe?
  • Add testing Launchpad project.
  • Test this in an actual project once all the points are done!

Add to Launchpad

LG Project

Wish List

Known Issues

libpng issues

Installing img-loader on some versions of OSX may raise errors with a missing libpng dependency:

	Module build failed: Error: dyld: Library not loaded: /usr/local/opt/libpng/lib/libpng16.16.dylib

This can be remedied by installing the newest version of libpng with homebrew:

	brew install libpng

PurifyCSS

PurifyCSS purifies all CSS that is not being used in HTML files. This, essentially, does not include JavaScript files that may include CSS Modules, JSX, etc. The PurifyCSS team has a work around but the issue is still present.

As this project assumes you will be using most of your CSS in classes and IDs you set in JavaScript, I will comment out PurifyCSS for the time being.

JSHint

Current ReadMe for JSHint shows outdated configuration.

Sources

Webpack Launchpad takes the best parts from these fine folks and their tutorials:

And follows the conventions of these fine... uh... sites/entities/folks?

About

Webpack Launchpad is a small, easy-to-use and well-documented Webpack boilerplate for Webpack beginners. Use it to create your next amazing project!

Topics

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published