I have two separate project, laravel and nuxt;
i want to, when i upload file from the laravel, it'll be stored on static folder of the nuxt project. Is there any way for that?
For that, you'll need to send your file upload to a CI that will inject it into the Nuxt project, and rebuild the whole Nuxt app.
Also, remember that static is not bundled via Webpack.
Meaning that it will be shipped raw: if it's uploaded while not being properly optimized, it'll be shipped as is (would be better suited into an /assets directory but still >> build time for the whole project required here).
Even hosting it on your Laravel server is more worth at this point.
TLDR: it's not worth to send it to Nuxt's static directory.
I recommend hosting it on a CDN or alike.
Related
I work on a single-page application written in Vue.js 3 and built by Vue CLI 5 (Webpack 5). The app is being served from a Laravel app which is deployed to AWS by Laravel Vapor. This tool also uploads all static assets (including JS chunks) to AWS S3 and make them available via CloudFront.
I want to load all static assets used in the Vue.js app from this CDN. The URL of the CloudFront distribution is available at build time in ASSET_URL environment variable. I have written my own asset functions in both TS and SCSS which are able to resolve asset paths properly for both local development and production environment. I use these functions whenever I write a URL of a static asset (image, font, etc.) in either .scss or .vue file and everything works fine.
But I am not able to make Vue.js app load JS chunks from CDN. When I modify publicPath option in vue.config.js, Vue Router gets broken. If I try to change output.publicPath directly in Webpack config, I get an error from Vue CLI saying that I cannot modify it directly.
So I have written a script that rewrites all URLs pointing to static assets in the generated index.blade.php file (similar to index.html in a typical Vue.js project) and initial JS chunks are loaded from CDN now. However, all lazy-loaded chunks are still being loaded from the server where Laravel app is deployed. It looks like these paths are somehow defined the generated app.f73fadef.js file.
So my question is, how can I load all static assets (including JS chunks) from CDN while serving an app from a dynamic web server? Is it even possible to do this just by changing Vue CLI or Webpack config and without any dirty "hacks" (like modifying generated JS files)?
I have finally been able to solve this. The problem was caused by the following router initialization code:
createRouter({
history: createWebHistory(process.env.BASE_URL),
routes,
});
Once I remove the parameter of createWebHistory function, I was able to set publicPath option in vue.config.js to my CloudFront distribution URL and everything started to work properly. I was even able to remove my own script that changed the URLs in index.blade.php since it was no longer needed.
According to the docs we are able to put a 503.html document inside the root of our Laravel project.
You may customize the maintenance mode splash screen for your application by placing a 503.html file in your application's root directory.
I would however love to be able to put one or more assets on this page (for example our Logo) to make this page better more personal. Laravel Vapor automatically uploads your static assets to cloudfront, which is not a problem if you're using the asset() helper. However, are there any solutions already being made? I can't find any.
Is there anyone who has created a solution to make this happen?
With Vapor every time you deploy all the assets get a new cloudfront url. This is mostly fine for js and css which we change often. Images, logos etc do not change much.
Better to make another bucket on aws and hard code the path the image file in your 503. Doesn't need to be deployed every time. Your users browsers can cache it for as long as you set it in the bucket.
I'd like Vapor to only change asset urls if the files have changed but so far that is not the case.
I am confused about the deployment of the laravel project in the live server.
I searched for this and found many solutions.
There are many processes to deploy laravel projects in a live server.
Someone suggesting to remove all files and folder from public folder
someone saying to change .htaccess etc.
What is the perfect way to deploy laravel projects in the live server?
If, I have to remove public folder then, why laravel included it?
If I have to copy .htaccess to root directory and need to change it.
Then why it is not used laravel as default. Would someone explain it to me, please?
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?
Problem: Pakyow App deployed to Heroku and all JS and CSS sourced/linked in template head 404.
I assume this is a problem stemming from Heroku, but rather not one that I am aware of. As far as I know, Heroku allows static assets in the public directory.
Anyway, looking for some helpful pointers from Pakyow users.
The app (currently) is at http://pakyow-go.herokuapp.com and the repo can be found at http://github.com/jphager2/pakyow-go.
This is an unfortunate default config option in the currently released version. To get around it, add this to the production configuration block in app.rb:
app.static = true
The reason it works this way out of the box is in most production cases you don't want the app serving static files. This would instead be the responsibility of the HTTP server. On Heroku though, you want the app server to serve static files unless you host them from a CDN.