@webpack_ru
Webpack — русскоговорящее сообщество

Обсуждения webpack, лоадеров, плагинов и сборок Правила: http://bit.ly/our_etiquette См. также: @rollup_ru, @react_js, @vscode_ru, @macos_ru, @js_ru

974 members

Архив канала @webpack_ru 3 апреля 2018 г.

07:10:33 ДП
User 190778098
Добрый день. WebPack 4. Нужно чтоб jQuery был виден на html странице.
Подключаю его вот так 
 {
          test: require.resolve('jquery'),
          use: [ {
            loader: 'expose-loader',
            options: 'jQuery'
          }, {
            loader: 'expose-loader',
            options: '$'
          } ]
        }
и в файле который цепляется в этот html:
require("expose-loader?$!jquery");
require("expose-loader?jQuery!jquery");
Все работает. Но стоит добавить вторую точку входа - jquery перестает работать: 
entry: {
      common: [  'babel-polyfill', './common.js' ],
      testEp: './testEp', 
}
07:48:50 ДП
User 32530886
User 190778098
Добрый день. WebPack 4. Нужно чтоб jQuery был виден на html странице.
Подключаю его вот так 
 {
          test: require.resolve('jquery'),
          use: [ {
            loader: 'expose-loader',
            options: 'jQuery'
          }, {
            loader: 'expose-loader',
            options: '$'
          } ]
        }
и в файле который цепляется в этот html:
require("expose-loader?$!jquery");
require("expose-loader?jQuery!jquery");
Все работает. Но стоит добавить вторую точку входа - jquery перестает работать: 
entry: {
      common: [  'babel-polyfill', './common.js' ],
      testEp: './testEp', 
}
Лоадеры не для этого нужны
07:53:59 ДП
User 201036437
User 190778098
Добрый день. WebPack 4. Нужно чтоб jQuery был виден на html странице.
Подключаю его вот так 
 {
          test: require.resolve('jquery'),
          use: [ {
            loader: 'expose-loader',
            options: 'jQuery'
          }, {
            loader: 'expose-loader',
            options: '$'
          } ]
        }
и в файле который цепляется в этот html:
require("expose-loader?$!jquery");
require("expose-loader?jQuery!jquery");
Все работает. Но стоит добавить вторую точку входа - jquery перестает работать: 
entry: {
      common: [  'babel-polyfill', './common.js' ],
      testEp: './testEp', 
}
Почему не подключить его через иморт? Или я что-то не понял?
07:55:17 ДП
User 190778098
Через import он в html не виден
08:10:34 ДП
User 67164223
Боже блять, 2 наносекунды в гугле
08:10:38 ДП
User 67164223
plugins: [
  new webpack.ProvidePlugin({
    $: "jquery/dist/jquery.min.js",
    jQuery: "jquery/dist/jquery.min.js",
    "window.jQuery": "jquery/dist/jquery.min.js"
  })
];
08:19:16 ДП
User 190778098
Угу.  Как же
08:19:48 ДП
User 190778098
Это делает доступным в модулях без импорта а не в global
08:20:10 ДП
User 134905826
User 67164223
plugins: [
  new webpack.ProvidePlugin({
    $: "jquery/dist/jquery.min.js",
    jQuery: "jquery/dist/jquery.min.js",
    "window.jQuery": "jquery/dist/jquery.min.js"
  })
];
хуевый ответ, он не делает window.*
08:20:35 ДП
User 67164223
мне похуй. Я не юзаю jq
08:20:55 ДП
User 30260375
User 134905826
хуевый ответ, он не делает window.*
Ну так сделай сам
08:21:02 ДП
User 134905826
User 67164223
мне похуй. Я не юзаю jq
тогда смысл давать плохие советы
08:21:19 ДП
User 67164223
User 134905826
тогда смысл давать плохие советы
раз ты загуглить не можешь
08:21:28 ДП
User 134905826
User 30260375
Ну так сделай сам
я делал, expose-loader нужен для доступности в window
08:22:13 ДП
User 134905826
User 67164223
раз ты загуглить не можешь
похоже перепутыл с другим, я тебе замечание сделал что твой ответ не в кассу -- не вводи в заблуждение людей
10:20:20 ДП
User 268035
https://github.com/HerringtonDarkholme/yats.vim
github.com/HerringtonDarkholme/yats.vim
yats.vim - Yet Another TypeScript Syntax: The most advanced TypeScript Syntax Highlighting in Vim
10:20:23 ДП
User 355846509
оу щит. ты про вим. тслинт не врубал на нём. еслинт ок работает. есть претензии, но не в скорости дело.
10:20:36 ДП
User 32530886
User 268035
https://github.com/HerringtonDarkholme/yats.vim
github.com/HerringtonDarkholme/yats.vim
yats.vim - Yet Another TypeScript Syntax: The most advanced TypeScript Syntax Highlighting in Vim
@ide_ru
10:21:58 ДП
User 39182759
User 355846509
оу щит. ты про вим. тслинт не врубал на нём. еслинт ок работает. есть претензии, но не в скорости дело.
но главное - подсветка синтаксиса в tsx!
создатели плагинов для тс еще гордо говорят, что tsx - не их проблема и КОНЕЧНО ЖЕ для этого нужен отдельный плагин
10:22:27 ДП
User 355846509
User 39182759
но главное - подсветка синтаксиса в tsx!
создатели плагинов для тс еще гордо говорят, что tsx - не их проблема и КОНЕЧНО ЖЕ для этого нужен отдельный плагин
погоди, оно разве не работает в просто .ts ?
10:22:41 ДП
User 355846509
они же, вроде, завезли жсх в просто тс
10:22:47 ДП
User 355846509
не это неточно
10:22:48 ДП
User 32530886
User 355846509
погоди, оно разве не работает в просто .ts ?
Tsx и TS это разный синтаксис
10:23:00 ДП
User 32530886
Поэтому два расширения
10:23:06 ДП
User 355846509
User 32530886
Tsx и TS это разный синтаксис
То есть не так же, как сейчас бабелевский .js ?
10:23:09 ДП
User 32530886
User 355846509
То есть не так же, как сейчас бабелевский .js ?
Нет
10:23:33 ДП
User 355846509
блджд. хотя правильно.
10:23:47 ДП
User 39182759
энивей, мне кажется, что на уровне плагинов это разделять - тупизм
10:23:48 ДП
User 32530886
Там дженерики по другому
10:23:53 ДП
User 32530886
User 39182759
энивей, мне кажется, что на уровне плагинов это разделять - тупизм
+
10:24:07 ДП
User 39182759
и имеем прекрасный https://github.com/HerringtonDarkholme/yats.vim
github.com/HerringtonDarkholme/yats.vim
yats.vim - Yet Another TypeScript Syntax: The most advanced TypeScript Syntax Highlighting in Vim
10:24:22 ДП
User 39182759
и вообще никакой https://github.com/ianks/vim-tsx
github.com/ianks/vim-tsx
Contribute to vim-tsx development by creating an account on GitHub.
10:26:39 ДП
User 355846509
User 32530886
Там дженерики по другому
*фейспалм*
11:05:29 ДП
User 115191768
как называется вебпак плагин который грамматику проверяет?
11:28:54 ДП
User 112715267
О.о такой есть?
11:30:15 ДП
User 55943427
https://www.npmjs.com/package/eslint-plugin-spellcheck ?
npmjs.com/package/eslint-plugin-spellcheck
ESLint rules to spell check js files
01:39:57 ПП
User 120820751
Привет, при установке проекта получаю какой то ад, причин которого понять не могу и нагуглить тоже не вышло. Подскажите пожалуйста:

ERROR in (webpack)/lib/NormalModule.js
Module not found: Error: Can't resolve 'module' in '/path/node_modules/webpack/lib'

ERROR in (webpack)/lib/node/NodeTargetPlugin.js
Module not found: Error: Can't resolve 'module' in '/path/node_modules/webpack/lib/node'
01:57:43 ПП
User 120820751
Кто нибудь?
02:33:25 ПП
User 160061898
User 120820751
Привет, при установке проекта получаю какой то ад, причин которого понять не могу и нагуглить тоже не вышло. Подскажите пожалуйста:

ERROR in (webpack)/lib/NormalModule.js
Module not found: Error: Can't resolve 'module' in '/path/node_modules/webpack/lib'

ERROR in (webpack)/lib/node/NodeTargetPlugin.js
Module not found: Error: Can't resolve 'module' in '/path/node_modules/webpack/lib/node'
У тебя там вебпакдевсервер?
02:34:52 ПП
User 120820751
для локальной разработки
02:35:10 ПП
User 120820751
+ для дева локала и прода сборка просто вебпаком
02:35:29 ПП
User 120820751
переписал полностью конфиг вебпака с 0 — баг исчез
в задумчивости
02:35:37 ПП
User 160061898
devServer в конфигах есть?
02:36:04 ПП
User 120820751
только для локала, ошибки на любом окружении
выглядит как
02:36:23 ПП
User 120820751
devServer: {
    hot: true,
    inline: true,
    contentBase: ['/', path.join(projectPath, 'build'), path.join(projectPath, 'src/static')],
    port: 3030,
    host: '0.0.0.0',
    compress: false,
    historyApiFallback: true,
    disableHostCheck: true,
    open: true,
    openPage: '',
  },
02:36:51 ПП
User 160061898
мб у тебя разные версии стояли
02:37:00 ПП
User 160061898
Поэтому не запускалось, ты переустанавливал?
02:37:24 ПП
User 120820751
чего?
вебпак я пробовал для 3.6 и 4 с одним конфигом
ошибка была одинаковая
02:38:19 ПП
User 160061898
Ладно, хорошо, что все так и закончилось
02:38:24 ПП
User 160061898
У меня тут вопрос. Когда собираешь бандл понятно. Но вот допустим реакт подключается через cdn и висит в глобальном скоупе. Как собрать реактовский компонент, чтобы его удалось передать в реакт, прокинуть прямо в window?
02:39:39 ПП
User 182613717
externals?
02:42:03 ПП
User 160061898
Почти, но наоборот. Экстерналс дает возможность импортить из глобального скоупа. А я хочу прокинуть из бандла в глобальный скоуп
02:42:06 ПП
User 120820751
надо указать в externals и peerDeps
02:42:16 ПП
User 120820751
не понял
02:42:19 ПП
User 120820751
всмысле?
02:42:22 ПП
User 120820751
тогда просто в Deps
02:42:29 ПП
User 120820751
но тогда он из бандла
02:42:36 ПП
User 120820751
а ты же хочешь из CDN?
02:42:41 ПП
User 32530886
User 160061898
Почти, но наоборот. Экстерналс дает возможность импортить из глобального скоупа. А я хочу прокинуть из бандла в глобальный скоуп
 global.Foo = 1 ?
02:42:50 ПП
User 160061898
Ну я об этом иговорю
02:42:54 ПП
User 160061898
Тупо закинуть в глобал
02:43:16 ПП
User 182613717
expose-loader?
02:43:18 ПП
User 32530886
вебпак как раз о том, чтобы не срать в глобал
02:43:23 ПП
User 32530886
но в конфигурации есть такие опции
02:44:10 ПП
User 160061898
Да, но вот тот случай наступил, когда надо насрать. И сейчас получается, что компонент, который хочу прокинуть в глобал, прокидываю прям в его констукторе
02:46:13 ПП
User 182613717
так тебе сам компонент надо в глобале юзать?
02:50:30 ПП
User 160061898
Да, хочу прокинуть его в глобал, чтобы потом засунуть в React.createElement
02:50:51 ПП
User 160061898
выглядит как изъеб, да
02:52:30 ПП
User 76662447
Он и есть
02:54:51 ПП
User 182613717
ну я для такого использовал library, не для реакт компонентов, а просто чтобы из легаси кода к новому коду получить доступ, но не уверен можно ли один конкретный файл так обработать
02:57:18 ПП
User 122087672
User 160061898
Да, хочу прокинуть его в глобал, чтобы потом засунуть в React.createElement
есть expose-loader
02:57:22 ПП
User 122087672
если я тебя правильно понял
02:57:58 ПП
User 160061898
Да, сейчас его попробую, спс Max @dreyks
03:13:13 ПП
User 39232169
ты хочешь из легаси кода отрендерить реакт ?
03:22:57 ПП
User 160061898
Почти, я хочу, чтобы легаси код мог прокидывать в реакт компоненты данные
03:28:55 ПП
User 160061898
Даа, expose то, что доктор прописал
04:47:44 ПП
User 47236452
User 30260375
Нет
пиздеж и провокация, лоадеры умеют кешироваться и еще есть optimization.cache, который хуй знает как работает (вроде бы inmemory, но с холд бута результат хуже, чем после второго запуска)
04:48:26 ПП
User 30260375
User 47236452
пиздеж и провокация, лоадеры умеют кешироваться и еще есть optimization.cache, который хуй знает как работает (вроде бы inmemory, но с холд бута результат хуже, чем после второго запуска)
По дефолту ничего не кешируется.
04:49:35 ПП
User 47236452
User 30260375
По дефолту ничего не кешируется.
optimization.cache работает из коробки, все остальное просто true поставить. какой ужас)
05:43:37 ПП
User 259652278
Товарищи, как сделать переменные в чанке доступными глобально? Например, есть vendor.js, в котором подключены. Как можно сделать библиотеки видимыми в глобальном скопе?
05:44:36 ПП
User 182613717
expose-loader?
07:24:46 ПП
User 304993607
ребзи, кто нибудь сталкивался с тем, что вебпак медленно компилит? если учесть, что у меня hello world только
07:27:30 ПП
User 304993607
Time: 5974ms
пересобирает
07:29:49 ПП
User 1333299
Конфиг в студию, ну
07:30:00 ПП
User 1333299
Телепаты тут не водятся
07:33:10 ПП
User 304993607
стыдно)
07:33:33 ПП
User 304993607
const webpack = require('webpack');
const path = require('path');

const plugins = [
  new webpack.HotModuleReplacementPlugin(),
];

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'build'),
    filename: 'bundle.js',
    publicPath: '/',
  },
  stats: 'none',
  module: {
    rules: [{
      test: /\.js$/,
      exclude: /node_modules/,
      loader: require.resolve('babel-loader'),
      include: [path.resolve(__dirname, 'src')],
      options: {
        cacheDirectory: false,
        plugins: [
          'react-hot-loader/babel',
        ],
      },
    }],
  },
  plugins,
  devServer: {
    host: 'localhost',
    port: 3000,
    historyApiFallback: true,
    hot: true,
    proxy: {
      '/api': 'http://localhost:3001',
    },
  },
};
07:35:06 ПП
User 212795634
User 304993607
Time: 5974ms
пересобирает
размер бандла?
07:36:00 ПП
User 304993607
User 212795634
размер бандла?
277 KiBё
07:36:36 ПП
User 212795634
хз, у меня все моментально с хот релоадом
07:36:42 ПП
User 212795634
точно плагин нужен?
07:36:45 ПП
User 212795634
попробуй убрать
07:36:52 ПП
User 212795634
HotModuleReplacementPlugin
07:38:16 ПП
User 304993607
нужен, но он экономит всего 11кб
07:46:29 ПП
User 212795634
User 304993607
нужен, но он экономит всего 11кб
а комп какой?
07:47:15 ПП
User 304993607
в общем я глянул. проблема похоже с  hot-update
09:19:28 ПП
User 212795634
мертвы внутри
09:20:52 ПП
User 212795634
зачем потер то