Summary
After adding an image to my assets folder named foo - compressed.png and modifying a component to include it as follows:
...
<img src="../../assets/bar-compressed.png" />
<img src="../../assets/foo - compressed.png" />
...
... I started getting this error when trying to build (prod) or serve (dev):
This relative module was not found:
* ../../assets/foo%20-%20compressed.png in ./node_modules/cache-loader/dist/cjs.js??ref--13-0!./node_modules/babel-loader/lib!./node_modules/#vue/cli-service/node_modules/vue-loader-v16/dist/templateLoader.js??ref--7!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/#vue/cli-service/node_modules/vue-loader-v16/dist??ref--1-1!./src/features/landing/MyComponent.vue?vue&type=template&id=100c0404
Notes
Other images still work in the assets folder.
This image is certainly present in the assets folder.
Why does one image work and the other leads to this compilation error?
The spaces in the filename were the problem.
Changing the filename from foo - compressed.png to foo-compressed.png fixed the issue.
Is this a Vue bug? Or expected behavior?
Related
I use jekyll to generate html files having an image like:
<img src="/assets/images/view.png" alt="" />
When I generate a PDF with pandoc with that HTML, it shows:
Warning: Failed to load file:///assets/images/view.png (ignore)
The resulting PDF doesn't contain the image.
I think that's because the image's path is absolute, it loads from the file system, absolute path. I have tried --resource-path=assets/images/ but doesn't help. Does anyone know how to load images successfully under this case?
There might be a simpler solution, but I'd solve this by using a Lua filter that fixes the image path:
function Image (img)
-- remove leading slash from image paths
img.src = img.src:gsub('^/', '')
return img
end
Save this to a file fix-img.lua and pass the file to pandoc via the --lua-filter option.
In Docusaurus V2 how to link to a JSON file in the static folder?
I tried the following in a markdown file:
An exemple, is the following [JSON dataset](../../static/data/solar-radiation.json).
But Docusaurus then produce the following error:
./static/data/solar-radiation.json (./node_modules/file-loader/dist/cjs.js?name=assets/files/[name]-[hash].[ext]!./static/data/solar-radiation.json)
Module parse failed: Unexpected token e in JSON at position 0 while parsing near 'export default __web...'
File was processed with these loaders:
* ./node_modules/file-loader/dist/cjs.js
You may need an additional loader to handle the result of these loaders.
SyntaxError: Unexpected token e in JSON at position 0 while parsing near 'export default __web...'
at JSON.parse (<anonymous>)
My file is a valid JSON. For some reason, instead of displaying a static file Docusaurus seems to try to parse it...
I saw the same problem. My temporary solution is:
Change file name from .md to .mdx
Add this link to your json file
<a target="_blank" href="/json/file.json" download="file.json">Download</a>
I've also had the same problem!
According to the Issue #3561 on the Docusaurus GitHub, word from one of the developers is that the current best practise is to use the pathname:// prefix in front of your URL. To use your example:
An exemple, is the following
[JSON dataset](pathname://../../static/data/solar-radiation.json).
Apparently the reason why this happens is because there is a conflict between the babel-loader (used to load code) and the file-loader (used to load static assets). The pathname:// prefix skips both of these loaders, and just creates a link instead.
Using VBA, I am trying to download images from url, renaming them and saving them to folder.
I have found code that facilitates this, but it seems that all "names" with a "/" in it won't download.
Is this possible? Is there a way around it?
I have tried the code from the link Downloading Images from URL and Renaming
No error messages are provided. The images simply won't download.
Files are not allowed to have a / in their name, that's always been the case. The code works unless you put a symbol that's not allowed, which are / \ : * ? " < > |
I create javascript project and bower.json. After adding dependencies as follow gives me red-cross on project->bower_components->bootstrap->grunt->change-version.js file and query->src file:
"dependencies":{
"bootstrap":"~3.3.7"
}
This is first problem:
Description Resource Path Location Type
Expected name at 2:1 .eslintrc.json /gruntTest/bower_components/jquery/src line 2 JSON Problem
Second problem:
Description Resource Path Location Type
Unexpected token ILLEGAL change-version.js /gruntTest/bower_components/bootstrap/grunt line 1 JavaScript Problem
I assumed that eclipse neon doesn't need to download Nodeclipse & Enide and try to practice from scratch thats the reason error happened.
Nodeclipse & Enide must installed before practicing nodejs in eclipse.
I followed this link and worked great.
http://www.nodeclipse.org
I'm creating my documentation with Sphinx on ReadTheDocs, using their theme. The build process generates a genindex.html file, which can be referenced with:
Link to the :ref:`genindex` page.
which creates:
Link to the Index page.
I can't add genindex to my toctree, for example like so:
.. toctree:
foo
bar
genindex
because it's an auto generated file, which does not exist at rendertime. Moreover, Sphinx expects genindex to be a lokal file called genindex.rst.
How can I add it to my ToC / navigation?
As far as no one posts a better solution, I'll write down my workaround as a working solution.
Sphinx creates the index as a denindex.html in the build root directory. It can't be referenced in a toctree directive, because this directive references ReST files. So how to solve it?
So let's create a genindex.rst file and reference it from a toctree directive. This also creates a genindex.html in the build root directory. All links are created as expected. The genindex.html file needs to define a headline like "Index", which is used as a link title in the navigation bar.
After writing all HTML files from ReST files, Sphinx generates its index and overwrites genindex.html.
Source files:
Source file index.rst:
.. toctree::
:caption: Introduction
chapter1
chapter2
.. toctree::
:caption: Main Documentation
chapter3
chapter4
.. toctree::
:caption: Appendix
genindex
Source files genindex.rst:
.. This file is a placeholder and will be replaced
Index
#####
Navigation Bar Screenshot: