Voy a hacer una pequeña guia para mostrar lo rápido y simple que puede ser empezar un proyecto nuevo en VueJS usando Parcel como bundler, en lugar de otras soluciones (como webpack).

Parcel es un web bundler pensado en ofrecer una buena experiencia, ser super rápido y poder funcionar con 0 configuración. Todo eso junto parece imposible, pero como voy a mostrar a continuación es muy simple de poner en marcha.

Instalamos Parcel (de forma global)

npm install -g parcel-bundler

En la carpeta donde vamos a armar nuestro proyecto, inicializamos el proyecto, creando un package.json, para eso hacemos

npm init -y

Y ahora estamos listos para crear el contenido del proyecto.

Vamos a empezar con un ejemplo muy simple, directamente en VueJS. Para esto, en un archivo index.html agregamos:

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Ejemplo Parcel Vue</title>
  </head>
  <body>
    <div id="app"></div>
    <script src="./index.js"></script>
  </body>
</html>

Y en otro archivo, en index.js, agregamos:

import Vue from 'vue';
import App from './app.vue';

new Vue(App).$mount('#app')

Por último, creamos un componente Vue en modo Single File Component, para eso creamos app.vue:

<template>
  <div class="container">
    <p class="greetings">Hello {{ name }}</p>
    <p>How are you?</p>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        name: "World"
      };
    },
  };
</script>

<style lang="scss">
  $primary: #678;
  .container {
    p.greetings {
      color: $primary;
    }
  }
</style>

Ejecutamos lo que tenemos hasta el momento… para eso hacemos:

parcel index.html

Y Parcel nos va a informar que ya hay un servidor corriendo, ejecutando nuestro código. Podemos entrar directamente a esa dirección y ver el resultado.

Lo que pasó por detrás es muchisimo, y Parcel se encargó de todo, sin que tengamos que configurar nada. Parcel se descarga automaticamente todo lo necesario para poder procesar Vue, SASS, y cualquier otra tecnología que vayamos necesitando.

Maravilloso.

En la documentación oficial (desde donde yo basé este ejemplo) se pueden ver muchisimas más de las capacidades de esta genial herramienta que es Parcel.