HMR с Webpack / Laravel Mix / AdonisJS - PullRequest
Новая
       21

HMR с Webpack / Laravel Mix / AdonisJS

0 голосов
/ 04 мая 2018

У меня много трудностей, чтобы заставить горячую замену модулей (HMR) Webpack работать для моего стека приложений:

  • Adonisjs v4.0.28
  • Laravel Mix v2.1.11
  • Webpack v3.11.0
  • Vue v2.5.16

Все ресурсы внешнего интерфейса загружаются с сервера webpack-dev, а не с сервера приложений Adonis, например: 

<script src="http://localhost:8080/js/manifest.js" />
<script src="http://localhost:8080/js/vendor.js" />
<script src="http://localhost:8080/js/app.js" />

Мое приложение загружается и успешно выполняется, и при запуске webpack-dev-server и внесении изменений в исходные тексты оно корректно обновляет файл mix-manifest.json, добавляя файлы «горячего обновления», которые доступны по их URL-адресам. . 

{
    "/js/app.js": "/js/app.js",
    "/css/app.css": "/css/app.css",
    "/js/vendor.js": "/js/vendor.js",
    "/js/manifest.js": "/js/manifest.js",
    "/0.e28262e7e8d825cfaa1a.hot-update.js": "/0.e28262e7e8d825cfaa1a.hot-update.js",
    "/0.1a35d37d2386038f6c78.hot-update.js": "/0.1a35d37d2386038f6c78.hot-update.js"
}

Я не уверен, как устранить неполадки или что я делаю неправильно, чтобы заставить работать HMR.

* * Конфигурация тысяча двадцать-один * * тысяча двадцать-дв

скрипт npm : 

node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node node_modules/webpack-dev-server/bin/webpack-dev-server.js --hot --config=node_modules/laravel-mix/setup/webpack.config.js

webpack.mix.js 

const Env = require('@adonisjs/framework/src/Env');
const mix = require('laravel-mix');
const webpack = require('webpack');

const env = new Env(__dirname);
const appUrl = JSON.stringify(env.get('APP_URL'));
mix.webpackConfig({
  plugins: [
    new webpack.DefinePlugin({ APP_URL: appUrl }),
  ],
  devServer: {
    inline: true,
    quiet: false,
  },
});

mix
  .setPublicPath('public')
  .js('resources/assets/js/app.js', 'public/js')
  .extract(['vue', 'vue-router', 'axios'])
  .sass('resources/assets/sass/app.scss', 'public/css')
  .sourceMaps()
  .disableNotifications();

Полная конфигурация Webpack, сгенерированная Laravel Mix :

https://gist.github.com/jarodhayes/3e2accb996f6884321671bcd4cc2b690

1 Ответ

0 голосов
/ 06 мая 2018

Это похоже на проблему с Laravel Mix v2. Следующие изменения кода в модуле laravel-mix устранили проблему для меня:

https://github.com/JeffreyWay/laravel-mix/issues/1437#issuecomment-365484126

...