如何解决返回“错误无法获取/”的laravel应用程序使用laradock中的vuejs热重载

问题描述

我正在使用 webpack mix 在 laravel 应用程序中热加载 vuejs。但是，我在运行 npm run hot

后在每个页面加载时收到错误消息

Cannot GET / 用于主页 /

webpack.mix.js

const  mix  = require('laravel-mix');

var webpackConfig = {
   devServer: {
    proxy: {
      host: 'domain.local',// host machine ip
      port: 81,},watchOptions:{
      aggregateTimeout:200,poll:5000
    },}
}

mix.options({
  hmrOptions: {
    host: 'mmta.local',// site's host name
    port: 81,}
});

mix.webpackConfig(webpackConfig);

mix.js('resources/vue_app/src/main.js','public/app/js')
   .sass('resources/vue_app/src/styles/style.scss','public/app/css');

解决方法

有效的是：(dockerHost "172.20.129.2" and dockerPort: "8081");

mix.webpackConfig({
    mode: "development",resolve: {
        alias: {
            "@assets": path.resolve(__dirname,"resources/assets/site"),"@sass": path.resolve(__dirname,"resources/assets/site/sass"),"vue$": "vue/dist/vue.runtime.esm.js","@": path.resolve("./resources/assets"),},output: {
        chunkFilename: "assets/site/js/chunks/[name].js",devtool: "inline-source-map",devServer: {
        disableHostCheck: true,headers: {
            'Access-Control-Allow-Origin': '*'
        },contentBase: path.resolve(__dirname,'public'),host: config.dockerHost,port: config.dockerPort,watchOptions: {
            poll: true
        }
    },})

mix.options({
    hmrOptions: {
        host: config.dockerHost,port: config.dockerPort
    }
});

注意，在运行 npm run hot 后，您必须等到 npm 向您显示 ip