Boilerplates are fun, right?!

Boilerplates are fun, right?!

Good bye crappy config files!

I’m trying out Parcel.js for one of my most recent endeavours and I must say I’m quite loving it so far. Well, as you know everyone loves webpack and brunch. But, this baby 👶 gives a rock solid support for simple things whenever you want it.

I gotta admit, the zero-config stuff is really enticing. Especially, when you’re just getting started with JavaScript and web development in general. It has built in asset packaging and hot module reloading.

But, it really is only as powerful as the config-less aproach is. For medium and large scale projects, as everyone would speak out, going for brunch or webpack is the better idea.

$ yarn global add parcel-bundler

However, getting started with parceljs is as simple as installing parceljs bundler and writing an index page with some javascript.

index.html

<html>  
<body>  
  <script src="./index.js"></script>  
</body>  
</html>

index.js

console.log('Welcome to parcel.js');

Parcel has a development server built in, which will automatically rebuild your app as you change files and supports hot module replacement for fast development. Just point it at your entry file:

parcel index.html

Now open http://localhost:1234/ in your browser. You can also override the default port with the -p <port number> option.

Use the development server when you don’t have your own server, or your app is entirely client rendered. If you do have your own server, you can run Parcel in watch mode instead. This still automatically rebuilds as files change and supports hot module replacement, but doesn't start a web server.

parcel watch index.html

When you’re ready to build for production, the build mode turns off watching and only builds once. See the Production 🚀 section for more details.