My components are not being rendered when I upload my project on a live server. It works fine on my local machine after I run npm run production when I upload the changes none of the vue components are being loaded in the page. On my local machine the vuejs dev tools tells me the site is running in production but when I go to the live server in the console it says
You are running Vue in development mode.
and on the browser taskbar it says
Vue.js not detected
I have no idea how to fix it. I saw a post saying I should upload the node_modules folder to the live server. But I doubt that would change anything plus it would take too long. How can I fix this?
I found out that the server was loading an older copy of the js file. So I had to apply cache busting by adding a phantom query to the end of the file. <script type="text/javascript" src="/js/app.js?v=2.4.1"></script>
Related
I'm new with Laravel and I made web application but when I updated the image file or some css code it will not reflecting on live server.
I tried:
Route::get('/check',function(){ Artisan::call('cache:clear'); Artisan::call('optimize:clear'); Cache::flush(); });
but this is not working.
I just want to reflecting updated image file or css file when I update it.
"it will not reflecting on live server"
This is the bit that worries me being you've tried the cache clear commands. Laravel will mostly serve up the current assets, there are of course exceptions!
Laravel octane; If you're using this package then php artisan octane:reload
Other sources for these sorts of errors to check first would be
Browser cache - try renaming the files or adding a query string to their lings.
CDN cache - lots of people use cloudflare as a CDN and DNS, make sure development mode is turned on and you've flushed the cache there.
For the most part, just adding a query string and/or changing the name should be enough to prompt a fresh download.
I satarted a project based on a Laravel-Nuxt Starter kit, found it here : https://bestofphp.com/repo/cretueusebiu-laravel-nuxt-php-starter-projects
I connected it to Laragon, so I can have pretty urls and making it work on Apache and MySQL. It works nocely, and when I do npm run start, I can access the website locally on localhost:3000 and it updates. However, if I use the pretty url given by Laragon, example.home, it goes to the index.html in the public server, but it doesn't update, no matter what I do. I tried npm run build, but the public folder isnt updated, the changes I do in the Vue component are only visible in localhost:3000.
What can I do to update the public folder according to the changes I do ?
Thank you !
I am working on a Laravel project and part of the app was converted to a Vue app. Ultimately, the blade file is reading from the source of /dist/app.js , which is generated after running npm run production and runs the whole Vue app. The company only wants 1 engineer to run deploys to ensure backend code doesn't get inadvertantly changed.
To make strictly frontend changes, can I technically have the src read off a CDN in the Blade file and then just remove the Vue app entirely from the github repo into it's own so I can continuously make changes on my own. That way, I can make changes and then upload the new bundle to the CDN without touching the backend repo. Is that doable?
I have an Ubuntu VPS with Laravel v5.6 served with nginx, and I am trying to use React on the front-end. I don't know if this is possible what I want to do is:
use node and npm to build my front-end app locally,
generate the CSS and JS files and upload those already generated files to my VPS server,
the output should not change since as far as I know npm generates at JS and CSS files with your whole code in it
Thanks for the help, and if there is any suggestion for a different approach just let me know.
You should start to use a frontend bundling solution like webpack or parcel, they do exactly the same
If you generate your app with create-react-app it comes with webpack built-in
i have a laravel 5 & vuejs application on my local server (vue js that comes with laravel). And now i want to deploy this application on real server like "000webhost.com" to test.
Laravel works fine, but Vue doesn't, I get some unexpected behaviors like blank page when assigning the id="app" to the parent element, and when i remove the id="app" the page appears and works correctly but Vue doesn't.
This is my project structure:
project structure
When uploading,, I upload the whole project without "node_modules" directory (that comes with npm install) Could this be the reason ?
You need to run npm run dev or npm run prod to create your resource bundle with the javascript and other assets. You technically don't need node_modules, so long as you build the projects on another machine and upload all that to your hosted server.