Question

我下载了一个名为vuetable-2的Larvavel + Vue组件（非常好的BTW）。

首先，php artisan serve有效。一切都很好，除了它没有热更改.vue文件。

我终于让npm run hot工作，但是，当我转到页面时，我收到浏览器消息：

无法获取/

采取的措施：

检查我的依赖关系，据我所知，一切都是正确的。
删除了node_modules和rebuit（现在三次）npm install
创建了一个单独的测试项目，以确认Vue是否进行了热重装（它一样）

我怀疑这个问题是某种配置，但对于我的生活，无法弄清楚在哪里。

我发现的唯一奇怪的事情是，webpack.config.js表示会使用port 3000，但是，使用工匠时唯一可以使用 8000的端口，或运行dev hot使用8080 ，它会生成上面的消息。

但是，如果我对文件进行更改，我会得到漂亮的Laravel Mix toast，告诉构建是否成功，但无法在浏览器中看到它们。 webpack.config.js也有正确的构建路径，即public/。

这是我的package.json文件：

{ "private": true, "scripts": { "dev": "npm run development", "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=./webpack.config.js", "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=./webpack.config.js", "watch-poll": "npm run watch -- --watch-poll", "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=./webpack.config.js", "prod": "npm run production", "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=./webpack.config.js" }, "devDependencies": { "babel-plugin-transform-runtime": "^6.23.0", "babel-preset-stage-2": "^6.24.1", "bootstrap-sass": "^3.3.7", "cross-env": "^3.2.4", "laravel-elixir": "^4.0.4", "laravel-mix": "0.*", "lodash": "^4.17.4", "node-sass": "^4.5.2", "vue-loader": "^11.1.4", "vue-style-loader": "^2.0.0", "vue-template-compiler": "^2.2.4" }, "dependencies": { "axios": "^0.15.3", "jquery": "^3.1.1", "accounting": "^0.4.1", "vue-events": "^3.0.1", "vue-masked-input": "^0.4.1", "vue": "^2.1.10", "vuetable-2": "^1.3.1" } }

webpack.config.js文件与安装的标准文件相同。

Answer 1

我知道可能为时已晚。但对于将来仍在寻找答案的人

将此添加到webpack.mix.js文件

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

mix.webpackConfig({
    devServer: {
        proxy: {
            '*': 'http://localhost:8000'
        }
    }
});

运行后端服务器（php artisan serve），然后运行npm run hot。这会将所有前端请求代理到后端，以便可以正确处理文件。更多信息here

话虽如此，npm run hot应该无需开发人员修改即可工作。

来源https://github.com/JeffreyWay/laravel-mix/issues/2057

Answer 2

看来你错过了跨越环境的道路...... 试试这个：

"dev": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"hot": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
"prod": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"

我已删除您的"dev": "npm run development",和"prod": "npm run production",。如果您想更改命令，只需更改它们。

希望它有效。

Vue + Laravel 5.4 +混合 - “无法获取/”

2 个答案: