Comments (3)
Update:
Changing the .md file name, is also not resolving the issue.The .md displays the updated img the .pdf still the old one.
from marp-cli.
Whether images used by Markdowns are refreshed depends on the caching rules provided by both the internal browser process and the remote server serving the image.
Currently, Marp CLI cannot modify the caching rules of the internal browser spawned for making PDF. And there is no plan working for that because it may bring performance degrading and remote server overloading if caching could be disabled.
A common solution suggested in many Markdown processors is adding a query parameter to the image URL that doesn't affect the image. This makes the browser recognize the image that is provided from the new URL, and refresh the image without using a cache.
![](https://example.com/image.jpg)
# Add something useless query param to update, just like `?__update=v1`
![](https://example.com/image.jpg?__update=v1)
# Use different query param to update again
![](https://example.com/image.jpg?__update=v2)
You might write a plugin for the engine to automate this assignment.
References
from marp-cli.
A plugin example to assign unique query for the image URL when rendering Markdown (WARNING: It may bring overload to remote server):
// engine.config.js
const crypto = require('crypto')
const imageUniqParameterPlugin = (markdownIt) => {
const imageRuleIndex = markdownIt.inline.ruler.__find__('image')
if (imageRuleIndex === -1) throw new Error('Parser rule not found: image')
const originalImageRule = {
...markdownIt.inline.ruler.__rules__[imageRuleIndex],
}
// Replace existing markdown-it image rule to add unique parameter
markdownIt.inline.ruler.at(
'image',
(state) => {
const originalNormalizeLink = state.md.normalizeLink
try {
// Override normalizeLink to add unique parameter while parsing image
state.md.normalizeLink = (url) => {
try {
const urlObj = new URL(url, 'dummy://dummy.dummy/')
// Add unique parameter to avoid cache
urlObj.searchParams.set('__marp_v__', crypto.randomUUID())
let normalizedUrl = urlObj.toString()
if (normalizedUrl.startsWith('dummy://dummy.dummy/')) {
// Remove dummy protocol and host
normalizedUrl = normalizedUrl.slice(20)
}
return originalNormalizeLink(normalizedUrl)
} catch (e) {
console.warn(e)
// Fallback to original normalizeLink if URL parsing failed
return originalNormalizeLink(url)
}
}
return originalImageRule.fn(state)
} finally {
// Restore original normalizeLink
state.md.normalizeLink = originalNormalizeLink
}
},
{ alt: originalImageRule.alt }
)
}
module.exports = {
engine: ({ marp }) => marp.use(imageUniqParameterPlugin),
}
from marp-cli.
Related Issues (20)
- Unable to launch marp if a subdirectory or file is not readable HOT 1
- marp stuck a long time without any output HOT 7
- Greek characters in path HOT 3
- Marp and inotifywait HOT 2
- Keyboard shortcuts for moving quickly inside the presentation HOT 2
- Experiment: File conversions using Firefox through WebDriver BiDi
- Server Mode Auto-refresh Does Not Work in Docker HOT 3
- Different styling in HTML and PDF HOT 2
- Investigate about Node.js single executable applications HOT 1
- Add HTML head meta icon customization HOT 1
- [Bespoke transitions] Compatibility with Safari
- marp.exe rendering and watch mode do not work in msys on Windows 10 (i.e. git-bash) HOT 3
- The `punycode` module is deprecated. HOT 3
- Can't watch md file when passed a theme HOT 1
- fs.Stats constructor is deprecated.
- marp-cli docker pull rate limited HOT 3
- Publish the Docker image to GitHub container registry
- Unable to create pdf using Docker image HOT 1
- no images appear in mobile view of .html file,but it appears on pc HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from marp-cli.