https://github.com/webpack-preset/webpack-preset

:rocket: Zero config webpack-powered development!
https://github.com/webpack-preset/webpack-preset

Last synced: 4 months ago
JSON representation

:rocket: Zero config webpack-powered development!

• Host: GitHub
• URL: https://github.com/webpack-preset/webpack-preset
• Owner: webpack-preset
• Created: 2016-01-13T06:18:26.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2016-06-28T05:04:07.000Z (over 8 years ago)
• Last Synced: 2024-08-13T22:35:07.380Z (4 months ago)
• Language: JavaScript
• Homepage: https://www.npmjs.com/package/webpack-preset
• Size: 89.8 KB
• Stars: 145
• Watchers: 6
• Forks: 3
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Webpack Preset 

> Zero config [webpack](https://webpack.github.io/)-powered development!

[![npm version](https://img.shields.io/npm/v/webpack-preset.svg?style=flat-square)](https://www.npmjs.com/package/webpack-preset)

[![npm downloads](https://img.shields.io/npm/dm/webpack-preset.svg?style=flat-square)](https://www.npmjs.com/package/webpack-preset)

[![webpack channel on discord](https://img.shields.io/badge/discord-%23webpack%20%40%20reactiflux-61dafb.svg?style=flat-square)](https://discord.gg/0ZcbPKXt5bVrknv7)

We're all [pretty tired out](https://medium.com/@ericclemmons/javascript-fatigue-48d4011b6fc4#.1p2hp7afi) by Javascript and its tooling. Webpack has [a metric ton of configuration options](https://webpack.github.io/docs/configuration.html) that are particularly overwhelming when starting out, and get tiring after you've set up your eleventy billionth project. This project serves to speed up a lot of the setup process involved with getting webpack up and running.

:warning: **Keep in mind this tool is for quick prototyping and should not be used long-term in your projects.** :warning:   

Once your project has gotten big or is taken seriously enough, you should invest in a full webpack setup, tuned to your specific needs. But if you want to just crank out some code really quickly, this is the best way to get started!

## Installation

Want a nice Babel ES2015 setup? Just install the package and save it to your `package.json` file:

```sh

npm install --save webpack-preset webpack-preset-babel

```

## Getting Started

Webpack Preset runs a small web server on port 3000 with Webpack embedded within it. It's started via the `webpack-preset` binary and starts a small web server to develop against.

It will look for an entry point in your `package.json`'s `main` definition, falling back to a `index.js` file next to your `package.json` file.

It also serves up a small HTML file with the Webpack bundle included and a `div#root` for convenience. You can use your own HTML by creating a `static/index.html` file and you can place any other static files in that folder.

`webpack-preset` can be run directly from the `node_modules` folder:

```sh

./node_modules/.bin/webpack-preset

```

Or you can add it to your NPM scripts for easy access:

```json

"scripts": {

  "start": "webpack-preset"

}

```

Just run `npm start` and that's it! You can access the page at [http://localhost:3000](http://localhost:3000)

## Roadmap

- [ ] Userland config options via `package.json`

- [ ] More CLI options (list installed presets, install more presets)

- [ ] Globally installable

## Thanks

Bits of this project were inspired by @pirelentio's awesome [sagui project](https://github.com/pirelenito/sagui). Go check it out!

## License

MIT