Size: a a a

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

2019 December 05

SS

Sergey Slipchenko in Webpack — русскоговорящее сообщество
Maxim Afanasev
Ну, там в общем, можно подумать, как интегрировать это в вашу систему. Можно вызывать вебпак не как CLI, а из кода на ноде. Там вы сможете получить список ваших ассетов, бандлов и всего прочего и сделать с ним, что вам хочется, в файл сохранить или на REST-эндпоинт отправить.
тогда webpack manifest plugin проще заюзать
источник

d

ds in Webpack — русскоговорящее сообщество
Sergey Slipchenko
не понял в чём вопрос
На каждый билд собирается свой бандл со своими хэшами и шлюхами, если  локально буду проксировать то у меня будет отличный хэш от продакшена и с проксированием ничего не выйдет... *грустная история*, сорри, язык слегка подхрамывает, могу неверно излагать
источник

d

ds in Webpack — русскоговорящее сообщество
выход один)) поизучать как устроен encore и прочие интеграции .php решения с вебпаком
источник

🦜

🦜 in Webpack — русскоговорящее сообщество
montirovkaaa
Добрый день. Подскажите, пожалуйста, как в вебпак 3 затранспайлить зависимость, которая использует es-6?
ты можешь создать правило для этой зависимости и через бабель транспилировать как нужно
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
montirovkaaa
Спасибо. Я так и думал. Просто зависимость не запускается в ие11. Поэтому я подумал, что может он не транспилит ее
разобрались?
Вебпак транспайлит только import и requare, все остальное отдается бабелю
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
в свою очередь бабель что-то полифилит, что-то трафнсормирует. Например - array.flat он полифилит (добавляет недостающий метод). Сахар вроде стрелочных функций, async await и пр он трансформирует - т.е. переписывает на манер es5 (это подключается отдельно)
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
ds
Товарищи! Есть entrypoint,json сгенеринный AssetsPlugin -> php читает в  .json нужные пути и пушит их, разработка идёт через webpack-dev-server, т.е чтобы проксировать: имя бандлов должно быть индетично локальным == задеплоенным, что пушит php. НО, как быть с хэшами, если захотелось проксировать продакшн? Билдовалка продакшена сбилдит бандлы с разными хэшами и мне остаётся  только захардкодить у себя те же имена +хэш у бандлов? Соре., возможно потерял путь к истине (сейчас этого в помине нет)

p.s Проект слегка под отстал от мира в целом...
ничего не понял =(
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
вебпак билдит вам html и вставлеными скриптами со всеми хешами, php отдает index.html, должно работать без проблем
источник

🦜

🦜 in Webpack — русскоговорящее сообщество
Alex CherryTea
в свою очередь бабель что-то полифилит, что-то трафнсормирует. Например - array.flat он полифилит (добавляет недостающий метод). Сахар вроде стрелочных функций, async await и пр он трансформирует - т.е. переписывает на манер es5 (это подключается отдельно)
async await он на генераторы переводит, а генераторы уже на es5
источник

C

Ciemna_noc in Webpack — русскоговорящее сообщество
гайс, а как мне хотрелоад настроить в вебпаке?
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
🦜
async await он на генераторы переводит, а генераторы уже на es5
генераторы это часть es5 же
источник

C

Ciemna_noc in Webpack — русскоговорящее сообщество
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin') // installed via npm
const webpack = require('webpack') // to access built-in plugins
const CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = {
 entry: ['./src/index.js', './src/index.css'],
 output: {
   path: path.resolve(__dirname, 'dist'),
   filename: './dist/bundle.js'
 },
 module: {
   rules: [
     {
       test: /\.tsx?$/,
       loader: 'ts-loader',
       exclude: /node_modules/
     },
     {
       test: /\.js$/,
       exclude: /node_modules/,
       use: {
         loader: 'script-loader'
       }
     },
     {
       test: /\.css$/,
       use: ['style-loader', 'css-loader', 'sass-loader']
     },
     {
       test: /\.svg$/,
       loader: 'svg-inline-loader'
     },
     {
       test: /\.(woff|woff2|eot|ttf|png|gif|jpg|jpeg)$/,
       use: [
         {
           loader: 'url-loader',
           options: {
             limit: 8192
           }
         }
       ]
     }
   ]
 },
 resolve: {
   extensions: ['.tsx', '.ts', '.js']
 },
 devtool: 'inline-source-map',
 devServer: {
   inline: true,
   port: 8080,
   hot: true
 },
 plugins: [
   new HtmlWebpackPlugin({ template: './src/index.html' }),
   new HtmlWebpackPlugin({
     filename: 'register.html',
     template: './src/register.html'
   }),
   new HtmlWebpackPlugin({
     filename: 'login.html',
     template: './src/login.html'
   }),
   new CopyWebpackPlugin([{ from: './src/index.html', to: './src/register.html' }])
 ]
}
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Ciemna_noc
const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin') // installed via npm
const webpack = require('webpack') // to access built-in plugins
const CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = {
 entry: ['./src/index.js', './src/index.css'],
 output: {
   path: path.resolve(__dirname, 'dist'),
   filename: './dist/bundle.js'
 },
 module: {
   rules: [
     {
       test: /\.tsx?$/,
       loader: 'ts-loader',
       exclude: /node_modules/
     },
     {
       test: /\.js$/,
       exclude: /node_modules/,
       use: {
         loader: 'script-loader'
       }
     },
     {
       test: /\.css$/,
       use: ['style-loader', 'css-loader', 'sass-loader']
     },
     {
       test: /\.svg$/,
       loader: 'svg-inline-loader'
     },
     {
       test: /\.(woff|woff2|eot|ttf|png|gif|jpg|jpeg)$/,
       use: [
         {
           loader: 'url-loader',
           options: {
             limit: 8192
           }
         }
       ]
     }
   ]
 },
 resolve: {
   extensions: ['.tsx', '.ts', '.js']
 },
 devtool: 'inline-source-map',
 devServer: {
   inline: true,
   port: 8080,
   hot: true
 },
 plugins: [
   new HtmlWebpackPlugin({ template: './src/index.html' }),
   new HtmlWebpackPlugin({
     filename: 'register.html',
     template: './src/register.html'
   }),
   new HtmlWebpackPlugin({
     filename: 'login.html',
     template: './src/login.html'
   }),
   new CopyWebpackPlugin([{ from: './src/index.html', to: './src/register.html' }])
 ]
}
мм он уже включен
источник

C

Ciemna_noc in Webpack — русскоговорящее сообщество
он не релоадится
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Ciemna_noc
он не релоадится
а как ты запускаешь?
источник

🦜

🦜 in Webpack — русскоговорящее сообщество
Alex CherryTea
генераторы это часть es5 же
es6
источник

C

Ciemna_noc in Webpack — русскоговорящее сообщество
Alex CherryTea
а как ты запускаешь?
в смысле yarn run dev
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
🦜
es6
о как, мне казалось оны были до
источник

A

Alex CherryTea in Webpack — русскоговорящее сообщество
Ciemna_noc
в смысле yarn run dev
эт понятно, а что там в yarn dev
источник

C

Ciemna_noc in Webpack — русскоговорящее сообщество
"dev": "webpack-dev-server --mode development --open"
источник