i need some help. I wrote an SPA using VueJs. I ran "npm run build" so i can test my app on my Xampp server. The build generated a "/dist" folder. I changed the index.html in the dist folder to index.php. I tried serving the dist folder with Xampp but it shows a blank page. Please help. I have uploaded the image showing the errors
https://i.stack.imgur.com/ae7GM.jpg
I had the same issue; a bunch of 404's in my console after running
npm run build. Ceejayoz is correct in suggesting you take a look at your network tab to see where the server is expecting to reach the file.
His suggestion tipped me off that my application did not have a base URL set.
Vue's docs on this.
After setting the path my app was located at, I reran the build process and it came right up.
dist files can only be served via http, you have to deploy it to your hosting server before you can see the output of your vue app
Related
We have picked up a very messy half built project and are trying to get it into an external beta testing state...
It is a next.js application which works fine if we run npm run build and then npm run start.
We prefer to host it on Firebase, for all the normal reasons and I believe it should be possible to do so.
However, when we install firebase and enable firebase experiments:enable webframeworks and firebase init hosting and accept the default options (Y,N) it adds the standard firebase index.html to the public folder - even though it didn't ask if we wanted that...
If we leave that index.html in place in the public folder then run firebase serve or firebase deploy, the /public/index.html is delivered as the root page of our site. When it should be the Index of the next application. If we delete the firebase index.html, and then rerun firebase serve to rebuild, then we get an 'undefined url' error (as it can't find the /public/index.html presumably).
We have an index.tsx in the /pages dir and when we run firebase serve, the build process does seem to be placing index-xxxxx.js chunk files etc. in .firebase/sitename/hosting/_next/static/chunks/pages.
We have tried adding rewrites in the firebase.json of various sorts, changed versions, everything we can think of. But still can't work out why firebase is not recognising the site root index page when it is running just fine on npm run start.
Any help appreciated to help us troubleshoot.
We are running nextjs build with yarn , pm2 and then using nginx to proxy the port.
I can see a build number inside .next/BUILD_ID and .next/static/BUILD_ID/_buildManifest.js file.
But in UI when taking this domain.com/_next/static/BUILD_ID/_buildManifest.js showing 404.
This issue happending only for server render pages.
We have other client side render pages and those are working but with different BUILD_ID name and not sure how its working.
Tried to delete .next folder and taken build again. But still issue is there...
Any suggetion how this can solve ?
I tried to deploy my application using Firebase (in build folder I have an index.html file) but I get the following error:
Does anyone know what might had gone wrong?
That's actually the default content in the automatically generated index.html file by the Firebase CLI when you initialize your project. That's not an error; If you already have HTML ready to go, just paste it inside the index.html file inside your build folder.
Your screenshot is showing the local index.html file, make sure to deploy your site by running firebase deploy --only hosting; And also double check your public attribute within your firebase.json file is configured to take the build folder.
How can I configure the Polymer build so I can deploy my app built on Windows to my Raspberry Pi running NGINX (in a sub directory)?
I could not install polymer-cli directly on my Raspberry Pi since the chromedriver (which polymer-cli needs) is only available for 64 bit Linux and the official Raspian OS is currently 32 bit only.
So I installed polymer-cli on my Windows machine, and created my first Polymer app according to https://www.polymer-project.org/3.0/start/toolbox/set-up, I also created the new-view page.
I can now run the app using polymer serve (which shows the app correctly in the browser on the Windows machine) and build using polymer build. Now I want to deploy so I copied the build directory (which contains three built variants, es5-bundled, es6-bundled and esm-bundled) to a sub-directory of the NGINX root, /var/www/html/polymer/build.
Firing up my browser and pointing at http://<raspberrypi-ip>/polymer/build/esm-build I see two errors.
The src="node_modules/#webcomponents/webcomponentsjs/webcomponents-loader.js" and src="src/my-app.js" in index.html gives 404. I could not find how to configure polymer-cli to change these, and still serve a working app in Windows so I manually added polymer/default/ to those two paths in the index.html.
Now I end up with a grey page in my browser, no further error messages...
Moving to my phones browser and entering the same url, http://<raspberrypi-ip>/polymer/esm-build, I actually see my app, together with an Oops you hit a 404. Head back to home link. following that link I get to my app, which seems to be working - but the URL is now http://<raspberrypi-ip>/new-view.
I've also played with the NGINX try_fileswithout luck...
server {
...
location /polymer/default {
try_files $uri /polymer/default/index.html =404;
}
}
EDIT: In Serving Polymer App to a /path not at root I found out that I also need to adjust rootPath in index.html. However I still get the 404 described above if I point my browser at http://<raspberrypi-ip>/polymer/esm-build/index.html...
Also, is there any way to refer to the rootPath in the <script src="">tag I manually edited above?
This is my first encounter with Polymer and NGINX, so any pointers are appreciated.
After doing some research, I still cannot understand why my assets in the bundles folder return 404 errors when I try to reach them.
I can see the files on the server, but when I try to reach them, symfony returns a 404 error.
For example, I have this file on the server : web/bundles/aluser/images/li-plus.png, but trying to access it with https://my-site.com/bundles/aluser/images/li-plus.png returns a 404 error. But on the other hand I can access files in https://my-site.com/images/li-plus.png for example.
I did the assets install and dump commands, cleared the cache but no results.
Thank you.
Unless you are on a local install it probably has to do with your server not pointing to the web folder. I had that problem on a shared hosting what i did was to make a symlink from server home (www, public_html or whatever) to web and it worked like a charm.
Thank you all for your answers,
they pointed me in the right direction (a problem with the server) :
I did a asset install and dump commands with the root user of the server, all files created were then associated to this root user, and apache wouldn't serve them anymore.
After a chown, everything was working again.
Thanks again :)