After nuxt generate as target: 'static', images are not showing when we run the dist build by npm run start.
though in dev mode images are showing correctly.
I have used image URLs as src of img.
when we inspect on the browser, its showing links are there but not rendering on the page.
Versions
nuxt: "^2.15.7"
node: v14.17.4
What is Expected?
Images should work after generate.
Related
I have a problem with displaying multiple API using Redocusaurus plugin
My nav dropdown looks like in the image
My Redocusaurus settings looks like in the image above
I keep my yml files in the folder apiConfigFiles
And locally everything working fine, but the problem appears when I make npm run build I have errors like in the image above...
Do you have any ideas how I can repair this??
I have a Vue-cli project with Vuetify. After "npm run build" command files in Dist folders looks like minified files. But after publishing I can see non-minified code in Chrome devtools. What is missed?
On your dist folder the files are combined minifided to make delivering them from the server more efficient.
Next to this files you will see a *.map file. This is the source map. This is a file that maps from the transformed source to the original source, enabling the browser to reconstruct the original source and present the reconstructed original in the debugger (in your example Chrome Dev Tools).
You can turn off this option as explained in the vue-cli docs default is set to true
Using a source map
The Nuxt documentation (latest) states that for SPA you need to set ssr: false in nuxt.config.js. Also, every vue file in the pages folder is added to the router configuration, so you don't have to do this yourself. This is both correct and works perfectly, but there is something I really don't understand.
When I run npm run build (nuxt-ts build), it builds the production output of the project and puts in the dist folder (default). I was surprised to see that even though I configured it to be a SPA, it still generates HTML files for each vue file in the pages folder.
It happens with newly generated projects using npx nuxt-create-app as well.
What I'd expect is that it only generates one HTML file (which is index) when ssr is set to false and when I want a static app, I would use npm run generate or set target to 'static' to create HTML files per route.
Nuxt documentation also states this for the target property:
https://nuxtjs.org/docs/2.x/get-started/commands#target-server-default-value (builds output to dist)
https://nuxtjs.org/docs/2.x/get-started/commands#target-static (generates HTML per route)
All I have in my config is ssr set to false, so it should not generate static files (HTML) per page.
What am I missing here, or am I misunderstanding how this works?
Thanks in advance!
Remember that in a static setup, your visitors may arrive at your site via any of your page routes— not just index.html.
For example, they may access https://www.your-app.com/contact-us. If you do not have a contact-us.html file available, and you don’t have a server configured to handle this request (as is the case with universal mode), you’re gonna end up with a 404.
What happens in static mode is contact-us.html is served, which contains the minimum javascript necessary to hydrate your nuxt app, then SPA mode kicks in— giving you client-side navigation.
I am building an app , my app contains a folder called content that folder contains a menu.html file that is calling some js, css files
content (size 5 MG)
menu.html
css
js
images
my problem is that after having generated my apk , installed it on my mobile
it displays first screen , when i click to move to next screen (the screen that is calling menu.html) here it sucks , i get a simple empty screen !
my question should I import manually this content folder to my android assets folder ? should I remove the 2 existing files in assets index.android.bundle and index.android.bundle.meta ?
You could try linking it. Since rnpm is part of RN you don't need to install anything, just add an entry in your package.json
"rnpm": {
"assets": [
"./path/to/file.html"
]
}
and then run react-native link
If you're already using rnpm you can add another path separated by a comma to that assets array. I don't know for certain but I would imagine the react-native is going to by default ignore HTML files unless they are explicitly linked.
You could also manually store the file in your Android assets folder and require it from there, but this won't work for iOS so if you're going cross platform I would try to get it to work via link.
Also as a side note, WebView kind of sucks. For a better user experience I would suggest rewriting the contents of that file in a way that react-native can render them.
In my vuejs app I have an iframe which should show another app. However I always get an
DOCUMENT NOT FOUND
In my component i wrote
<iframe src="/static/stbnotes/stbnotes.html"></iframe>
For my router I defined a base option
base: 'pat-os/'
This works fine in development - content will be loaded in the iframe. But not when creating a build using npm run build and load it from a server. The url for the iframe is now
http://localhost/static/stbnotes/stbnotes.html
where I want it to be
http://localhost/pat-os/static/stbnotes/stbnotes.html
How can I set a working relative path to the static folder (could be another folder as well) for the iframe?