Задать вопрос

amokrushin

Ответы пользователя по тегу Webpack

  • Как можно вставить html в виде строки в конкретное место функции с помощью Webpack?

    @amokrushin
    Например так (если добавить еще обработку ошибок, как минимум 404):
    const fs = require('fs');

module.exports.index = function (req, res, next) {
    fs.createReadStream('./src/pages/index.html').on('error', next).pipe(res);
});

    Но лучше использовать модуль express.static, еще лучше оставить статику веб-серверу nginx.

    Если же речь не об этом, а, например, о том как в скрипте используемом в процессе сборки с помощью webpack получить html в виде строки, то можно использовать webpack raw-loader
    import htmlString from 'raw-loader!./src/pages/index.html';
    Ответ написан
    Комментировать
    Комментировать

  • Как собирать проект спомощью Gulp/Webpack непосредственно на сервере?

    @amokrushin
    Этот плагин не может знать где был собран проект, на локальном компе или нет. Что касается вебпака, то он оставляет свой след, точнее загрузчик модулей в итоговом скрипте, поэтому и детектится.
    Добавите на любую страницу скрипт
    <script type="application/javascript">
    window.webpackJsonp = window.webpackJsonp || true;
</script>

    и плагин Wappalyzer покажет иконку вебпака для этой страницы.
    Что касается сборки на сервере, то действительно - также как и на локальном компе.
    Ответ написан
    Комментировать
    Комментировать

  • Как в webpack импортировать jquery библиотеку?

    @amokrushin
    Оно и понятно, ведь эта библиотека не использует module.exports и следовательно, ничего не возвращает.

    Это не библиотека а плагин jQuery, который оформлен в виде модуля UMD, module.exports в коде есть, а ничего не возвращает, потому как в этом нет необходимости.

    Сначала установить:
    npm i slick-carousel --save-dev
    Затем можно использовать следующим образом:
    require('slick-carousel');
require('slick-carousel/slick/slick.css');
require('slick-carousel/slick/slick-theme.css');
const $ = require('jquery');
$(document).ready(function(){
  $('.your-class').slick({
    setting-name: setting-value
  });
});
    Ответ написан
    1 комментарий
    1 комментарий

  • Webpack. Как исправить ошибку Uncaught ReferenceError: webpackJsonp_name_ is not defined?

    @amokrushin
    Проблема в том, что к каждому модулю entry webpack добавляет свой загрузчик (webpack runtime). Плагин CommonsChunkPlugin унес этот загрузчик в файл commons.js, который загружается в браузере вторым по очереди. А на момент исполнения кода файла babelPolyfill.js код загрузчика отсутствует и возникает ошибка.
    Как исправить?
    Есть такие варианты:
    1. удалить плагин CommonsChunkPlugin
    2. удалить babelPolyfill.js из конфига webpack и подключать уже готовую версию перед остальными тегами script
    3. подключать рекомендованным способом в том скрипте который загружается первым
    4. можно вынести webpack runtime в отдельный файл добавив еще раз плагин CommonsChunkPlugin после того что уже есть
    new webpack.optimize.CommonsChunkPlugin({
    name: 'webpack.runtime',
    minChunks: Infinity,
})

    и загружать его первым 
    <script src="./public/webpack.runtime.js"></script>
    но это точно костыль
    Ответ написан
    Комментировать
    Комментировать

  • Как импортировать стили из node_modules в компонент vue.js?

    @amokrushin 
    <script>
import fullcalendar from 'fullcalendar'
import 'fullcalendar/dist/fullcalendar.min.css'
    Ответ написан
    1 комментарий
    1 комментарий