Разница между Webpack/Babel и реагировать на скрипты

Ответ 1

По сути, они служат разным целям и обычно появляются вместе. Я объясню, для чего они предназначены.

столпотворение

Бабель - трейлер. Он может переводить все виды высокопроизводительных ECMAScript (не только ECMAScript, но и легко понять) в ES5, который более широко поддерживается браузерами (особенно старыми версиями). Его основная задача - превратить неподдерживаемые или самые современные языковые функции в ES5.

Webpack

Webpack - это, помимо прочего, анализатор зависимостей и пакетный модуль. Например, если модуль A требует B в качестве зависимости, а модуль B требует C в качестве зависимости, тогда webpack сгенерирует карту зависимостей, подобную C → B → A. На практике это намного сложнее, чем это, но общее Концепция заключается в том, что Webpack упаковывает модули со сложными зависимостями в пакеты. Относительно отношений webpack с babel: когда webpack обрабатывает зависимости, он должен все превратить в javascript, потому что webpack работает поверх javascript. В результате он использует разные загрузчики для перевода различных типов ресурсов/кода в javascript. Когда нам нужны функции ES6 или ES7, мы используем babel-loader для этого.

реагировать-скрипт

Когда мы начинаем проект, основанный на реакции, настройка среды сборки - сложная и трудоемкая работа. Чтобы помочь с этим, разработчики React создали пакет npm под названием react-scripts, который включает в себя множество основных настроек, которые понадобятся большинству людей для обычного приложения React. Babel и веб-пакет включены как зависимости в react-scripts

Ответ 2

WebPack и response-scripts - это немного разные вещи.

Webpack используется для компиляции пакета для вашего веб-приложения, которое может иметь произвольную форму и иметь некоторую точку входа. Более того, веб-пакет используется с предустановками babel, что позволяет использовать современные конструкции ES6+ в относительно старых браузерах. Кроме того, webpack отвечает за сборочные узлы node_modules в одном файле и, возможно, сжимает и оптимизирует его. Вы можете узнать больше о философии webpack здесь: https://webpack.js.org/concepts/

React-scripts - это всего лишь начальный набор для запуска некоторого настроенного webpack-dev-сервера, который настроен для работы с предоставленным образцом для React Playground. Это просто демонстрационная цель. У большинства современных веб-библиотек есть свой стартовый набор, даже серверные библиотеки, например. https://github.com/reimagined/resolve/tree/master/packages/resolve-scripts и так далее