Parcel

🚀 Блискавично швидкий

Parcel використовує воркери для увімкнення багатоядерної компіляції і має кеш файлової системи для швидких повторних збірок навіть після перезапуску.

📦 Зв'яжіть всі свої ресурси

Parcel з коробки має підтримку: JS, CSS, HTML, файлових ресурсів та багато іншого — немає необхідності в плаґінах.

🐠 Автоматичні трансформації

Код автоматично трансформується, використовуючи Babel, PostCSS і PostHTML, при необхідності — навіть node_modules.

✂️ Розділення коду без налаштування

Використовуючи динамічний синтаксис import(), Parcel розділяє ваші готові бандли, тому ви завантажуєте тільки те, що потрібно при початковому завантаженні.

🔥 Гаряча заміна модуля

Parcel автоматично оновлює модулі в браузері, якщо ви робите зміни в процесі розробки, без додаткових налаштувань.

🚨 Дружня реєстрація помилок

Parcel виділяє синтаксис коду, коли він стикається з помилками, щоб допомогти вам визначити проблему.

Привіт, світ!

Почніть свій додаток з HTML-файлу. Parcel слідує за залежностями з нього, для створення всього вашого додатка.

✏️ index.html

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

🛠 index.js

// Імпортуйте компоненти
import main from './main';

main();

🛠 main.js

// Імпортуйте CSS-модуль
import classes from './main.css';

export default () => {
  console.log(classes.main);
};

💅 main.css

.main {
  /* Посилання на файл зображення */
  background: url('./images/background.png');
  color: red;
}

Просто виконайте parcel index.html в консолі для запуску локального сервера. Імпортовані JavaScript, CSS, зображення і багато іншого — просто працюють! 👌

Бенчмарки

Пакувальник	Час, сек.
browserify	22,98
webpack	20,71
parcel	9,98
parcel (з кешем)	2,64

За основу було взято додаток з досить великим розміром, що містить 1726 модулів, 6,5 МБ нестисненого коду. Бандл був зроблений на 2016 MacBook Pro з 4-ядерним ЦП.