Невозможно настроить горячую перезагрузку модуля HMR для Symfony Webpack - PullRequest
Новая
       35

Невозможно настроить горячую перезагрузку модуля HMR для Symfony Webpack

0 голосов
/ 08 ноября 2019

В настоящее время я использую ручные перезагрузки с npx webpack, которые отнимают много времени. Итак, попытка реализовать HMR с использованием документов Webpack и этого учебного пособия

Он не выдает никаких ошибок при запуске npm start, сообщает, что файлы были сгенерированы, но файлы недоступны вкаталог назначения /dist. Если они размещены где-то еще, я не смог бы найти.

Кроме того, HMR как таковой, похоже, работает в том смысле, что он автоматически перекомпилируется после внесения изменений в файлы приложения.

Он также автоматически открывает localhost:8080, но показывает только список каталогов или сообщение типа CANNOT GET.

Кстати, я не использую Symfony Encore.

Каталог выглядит следующим образом: - bin - client // where the React files are - config // Symfony - node_modules - public - dist // here goes Webpack's output ( normally ) - index.php - src // Symfony app files - templates - Twig - var - vendor webpack.config.js

Приведенный выше файл webpack.config.js выглядит ниже, в последней попытке конфигурации 

const webpack = require('webpack');
const { InjectManifest } = require('workbox-webpack-plugin');
const ManifestPlugin = require('webpack-manifest-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractCssChunks = require('extract-css-chunks-webpack-plugin');
 const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');
 const path = require('path');
 const useDevServer = true;
 const publicPath = useDevServer ? 'http://localhost:8080/public/dist/' : '/dist/';

 console.log('path', path.resolve(__dirname, 'public/dist'));
 console.log('public path', publicPath);

module.exports = {
mode: 'development',
entry: './client/index.js',
output: {
    path: path.resolve(__dirname, 'public/dist'),
    filename: '[name].[hash].js',
    publicPath,
},
devtool: 'inline-source-map',
module: {
  ....
},
devServer: {
    // contentBase: './dist',
    hot: true,
    allowedHosts: [
        'http://127.0.0.1:8000',
        'http://127.0.0.1:8001',
        'http://localhost:8000',
        'http://localhost:8001',
    ],
},
plugins: [
    new webpack.HotModuleReplacementPlugin(),
 ...
...