lundi 25 juin 2018

Laravel 5 Vue hot module replacement (HMR)

My Vue HOT MODULE REPLACEMENT (HMR) not working. What I have and what I do:

  • local server on http:\db7\ on port 80 on Windows (OpenServer v5.2.2)
  • laravel latest version with composer install and npm install
  • next 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=node_modules/laravel-mix/setup/webpack.config.js", "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/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=node_modules/laravel-mix/setup/webpack.config.js", "prod": "npm run production", "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "live": "cross-env NODE_ENV=development webpack-dev-server --open --hot" }, "devDependencies": { "axios": "^0.18", "bootstrap": "^4.1.1", "cross-env": "^5.2.0", "jquery": "^3.2", "laravel-mix": "^2.0", "lodash": "^4.17.10", "popper.js": "^1.14.3", "vue": "^2.5.7" }, "dependencies": { "ajv": "^6.5.1", "bootstrap-datepicker": "^1.8.0", "js-cookie": "^2.2.0", "moment": "^2.22.2", "vue-flatpickr-component": "^7.0.4", "vue-router": "^3.0.1", "vue-snotify": "^3.1.0", "vuex": "^3.0.1" } }
  • in template i have <script src=""></script> and when I opening page and look page code I see <script src="//localhost:8080//js/app.js"></script>. When npm run hot I can see my js if open localhost:8080//js/app.js manualy from browser. I'm try write url manualy in template too - <script src="http://localhost:8080/js/bundle.js"></script>. The same result.
  • When npm run hot NOT runing netstat -ano | findstr 8080 in cmd clear - so, the 8080 port is not using. When npm run hotis runing - 8080 is LISTENING.
  • When I run npm run hot and reload page with appliccation in console no any messages like "HMR is running" and e.t.c.
  • When I do any changes in my Vue components I see, that "Compiled successfully" in my PHPStorm console, but in browser no any changes. And more - there are no any changes, if I reload page with ctrl+f5 or open page in chrome incognito mode. There are no any changes in app.js if I reopen localhost:8080//js/app.js in browser manualy too.
  • My webpack.mix.js in laravel root folder:

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

    mix.js('resources/assets/js/app.js', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css');

Help my please!



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire