CODEWITHSUNDEEP
laravelvuejs2
Ben
Ben

Reputation: 51

Nothing is changing when I edit the code in Vue

I just started to use Vue.js and for backend I have Laravel 5.

The problem is the following: I try to edit any data, or component or even the HTML in a view page, but nothing is changing and I have no idea why.

The existing website has a working page, done with Vue. But when I try to modify something from the source .vue file, nothing changes.

Maybe it has something to do with cache, have no idea...

I am not using npm, I just got the code, running in a Linux VM, under apache.

--

My package.json starts like this:

"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 --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },

But on the machine I can't find npm installed. Is this possible? What's going on in here?

update

I fixed installation of npm and node, but when running npm run dev I get errors. Check the error log here

Upvotes: 1

Views: 6280

Answers (1)

Giesburts
Giesburts

Reputation: 7648

When using Laravel you have to install all dependencies with NPM (node). You do that by running npm install in your command line in the directory of the Laravel project.

After that, all pre defined dependencies by Laravel (Such as Vue but also Axios and jQuery, see the Package.json file) are installed.

To use the Vue components (And other assets like JS code and scss) you have to compile them. With a fresh Laravel project you do that by npm run dev that will compile all your js/scss's in the resources/assets folder. So if you make a change to the Example.vue file (That is always installed with a fresh project) you run npm run dev and if everything was ok you are able to see the new changes.

To make things easier you can run npm run watch. This command will constantly check if you make changes to the assets. So if that command is active, and you make a change to a Vue component, it will automatically compile for you.

Hope this will help.

Upvotes: 8

Related Questions