Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

mstdmstd's avatar

Changes I make in @vue/cli app are not applied with local server

Hello, working with @vue/cli 4.0.5 in dev mode I run server locally and very often I see changes I make in my PhpStorm 2019.2.3 are not applied to my running local server

I see output in the console :

$ npm run serve

> [email protected] serve /mnt/_work_sdb8/wwwroot/lar/VApps/vtasks
> vue-cli-service serve

 INFO  Starting development server...
98% after emitting CopyPlugin

 DONE  Compiled successfully in 8350ms                                                                                                                                                                                             6:18:04 PM


  App running at:
  - Local:   http://localhost:8080/ 
  - Network: unavailable

  Note that the development build is not optimized.
  To create a production build, run npm run build.


But to see my changes in Phpstorm applied I need to close console with local server...
Just thought is it safe to close console with running server ?

Also I seems to me this problem started after I begin working with Nuxt app with default localhost:3000 port. I mean I work in one Kubuntu session , switching from one app to other in console and closing console with running localhost and running commands npm run serve / npm run dev Can it be the issue and how it can be detected / salved ? –

uname -a
Linux athoe 4.15.0-72-generic #81-Ubuntu SMP Tue Nov 26 12:20:02 UTC 2019 x86_64 x86_64 x86_64 GNU/Linux

package.json :

{
  "name": "ctasks",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "core-js": "^3.3.2",
    "font-awesome": "^4.7.0",
    "moment": "^2.24.0",
    "moment-timezone": "^0.5.27",
    "v-money": "^0.8.1",
    "vee-validate": "^3.1.0",
    "vue": "^2.6.10",
    "vue-focus": "^2.1.0",
    "vue-js-modal": "^1.3.31",
    "vue-nav-tabs": "^0.5.7",
    "vue-notification": "^1.3.20",
    "vue-router": "^3.1.3",
    "vue-select": "^3.2.0",
    "vue-the-mask": "^0.11.1",
    "vue-wysiwyg": "^1.7.2",
    "vue2-datepicker": "^3.3.0",
    "vue2-filters": "^0.8.0",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^4.0.0",
    "@vue/cli-plugin-router": "^4.0.0",
    "@vue/cli-plugin-vuex": "^4.0.0",
    "@vue/cli-service": "^4.0.0",
    "bootstrap": "^4.3.1",
    "jquery": "^3.4.1",
    "node-sass": "^4.12.0",
    "popper.js": "^1.16.0",
    "sass-loader": "^8.0.0",
    "vue-template-compiler": "^2.6.10"
  }
}

Thanlks!

0 likes
6 replies
Nakov's avatar

@mstdmstd I believe that you will need close and rerun the application server each time you make a change if you are using npm run serve

Plus to get all the changes you make in the JS files, you better open a terminal window and run npm run watch which will recompile the assets on every change.

But then again, you will have to always CTRL+C to kill the npm run serve and re-run it again.

Try it out and let me know :)

mstdmstd's avatar

I got :

$ npm run watch
npm ERR! missing script: watch

Some option missing in app config ?

Nakov's avatar

@mstdmstd sorry that's a script if you've been using laravel-mix but I see you are not. So you will have to run npm run build as I see. But always re-run npm run serve as well.

mstdmstd's avatar

Actually that is not Laravel project, but @vue/cli 4.0.5 And in package.json I have :

  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

No watch command as I have in Laravel... Also I had been working with this project for 2 monthes, but suffer it last several days...

mstdmstd's avatar

I made some additive checks :

Editing vue files of the project in defautl kate editor I opened the project in Visual Studio Code I see that my changes are not applied, until I close console and run npm run serve again

So I suppose that it is not PhpStorm options issue?

Nakov's avatar

@mstdmstd you are running npm run serve in the console so it has nothing to do with which IDE or Text editor you are using. The changes to the compiled assets are visible only when you run npm run build I am not sure if npm run serve runs that task before it starts the server, but anyhow, as I said twice already for the changes to be visible in the browser, you will have to kill and start the server on every change.

Please or to participate in this conversation.