Публикации по теме 'webpack-2'
используя html-webpack-plugin для создания index.html
Теперь, когда мы настроили webpack для упаковки и объединения нашего js-кода в один файл - app.bundle.js , нам нужен index.html для нашего веб-приложения с тегом сценария, имеющим src='app.bundle.js' .
У нас есть два варианта: создать его вручную или создать автоматически с помощью « html-webpack-plugin ».
Вариант 1. Создайте index.html вручную
Давайте сначала создадим файл index.html вручную. Внутри папки « dist », где webpack выводит файл app.bundle.js , добавьте файл «..
Как разделить локали Moment.js на куски с помощью Webpack
Moment.js - отличная библиотека для работы со значениями datetime в javascript, но у нее есть некоторые недостатки. Когда вы устанавливаете его как библиотеку npm и собираете с помощью webpack, он по умолчанию включает все языковые версии, поэтому пакет большой.
Взгляните на первый пример:
1. По умолчанию все языковые стандарты в одном файле.
Давай попробуем. Создайте новый проект узла:
mkdir project-with-moment
cd project-with-moment
npm init
npm install moment
npm install webpack..
Множественные записи
Иногда вам может потребоваться упаковать файлы javascript в несколько пакетов.
Например, мы можем захотеть создать два пакета – app.bundle.js для всего нашего кода для конкретного приложения и еще один пакет vendor.bundle.js для всех наших зависимостей npm и включить эти два пакета в два отдельных тега ‹script› в вашем index.html . Давайте посмотрим, как мы можем настроить webpack для этого.
Во-первых, давайте добавим ‘ lodash ’ как зависимость к нашему приложению.
npm..
STYFI любит Webpack: как мы реализовали этот убийственный пакет
Когда мы начинали, STYFI создавался с использованием « RequrieJs» . RequireJS - один из самых известных загрузчиков модулей для JavaScript. Для непосвященных загрузчики модулей - это в основном инструменты, используемые для указания зависимостей файла javascript и загрузки этих зависимостей в правильном порядке.
Почему мы отказались от RequireJs?
RequireJs в качестве загрузчика модулей заставил нас, разработчиков, использовать шаблон AMD, что, конечно, имело тогда смысл. Однако..
Основы Webpack: что такое Webpack?
Основы Webpack: что такое Webpack?
Webpack - это библиотека javascript, которая может преобразовывать синтаксис кода, а также объединять несколько файлов в один файл. Это особенно необходимо при создании больших приложений, где разделение или разбиение вашего javascript и css на несколько файлов может помочь с организацией, или, например, когда вам нужно простое решение для преобразования вашего синтаксиса es6 в читаемый браузером es5. Единственный выходной файл можно импортировать в..
Настроить проект React с помощью TypeScript и Webpack
Надеюсь, ваш поиск на этом заканчивается, если вы пытаетесь настроить проект React с помощью Typescript и webpack . Мы не будем обсуждать реакцию как таковую, но в конце вы сможете запустить собственное приложение для реагирования на машинописном тексте с помощью webpack.
Поскольку это в основном нацелено на разработчиков, относительно плохо знакомых с «новым» способом веб-разработки, мы подробно рассмотрим каждый шаг.
Предварительные требования
Узел установлен.
Node -..
Webpack 2, плагины jQuery и загрузчик импорта
Использовать плагины jQuery «в те времена» было просто.
<script src="jquery.js"></script>
<script src="jquery.slider.js"></script>
<script src="app.js"></script>
Но если вы хотите быть крутым и устанавливать плагины с npm и импортировать их как модули ES6, это не выход. Вместо этого вы бы хотели сделать что-нибудь вроде этого:
// app.js
import $ from 'jquery';
$('.slider').slider();
Но этого недостаточно. Вы должны..