I downloaded started with a Larvavel 5.4 + Vue component called vuetable-2 (very nice BTW).
Firstly, php artisan serve works. Everything is fine, except that it doesn't hot deploy changes to .vue files.
I've finally got npm run hot to work, however, when go to the page I get the browser message:
Cannot Get /
Actions Taken:
- Checked my dependencies, as far as I can see, all are correct.
- Deleted node_modules and rebuit (three times now)
npm install
- Created a separate test project to confirm Vue does hot reload (it
does)
I suspect the problem is some configuration somewhere, but for the life of me, can't figure out where.
The only odd thing I've found is, the webpack.config.js says it will use port 3000, yet, the only port that seems to be working is either 8000 when using artisan or run dev hot on 8080 which produces the message above.
However, if I make changes to the files, I get the nice Laravel Mix toast telling the build was successful or not, but can't see them in the browser. The webpack.config.js also has the correct build path, being public/.
This is my package.json file:
{
"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"
}
}
The webpack.config.js file is unchanged from the standard one installed.
I've tried everything I can think of, plus lots and lots of Google searches. After more than 2 days, I'll admit I am VERY frustrated! :-P Some help would be greatly appreciated.
Note: Also posted on stackoverflow