Relative CSS does not work

[junkoya]

I wrote .md file and .css file in same directory.

• test.md

# chapter
## subject

Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

• markdownpdf.css

h1 {
    background-color: black;
    color: white;
    font-size: 48pt;
    font-weight: bold;
}

h2 {
    font-size: 32pt;
    text-decoration-line: underline;
}

And I wrote settings.json as below:

"markdown-pdf.stylesRelativePathFile": true,
"markdown-pdf.styles": ["markdownpdf.css"]

But output pdf is like below:

Maybe, this tag on html is failed.

• test.html

<link rel="stylesheet" href="file:///markdownpdf.css" type="text/css">

When I modify it as below, it works.

<link rel="stylesheet" href="./markdownpdf.css" type="text/css">

[W1M0R]

I also have this issue. It worked in the past, but Visual Studio updated this week, so maybe there is a breaking extension API change.

[JoFrMueller]

Just wanted to affirm this issue and give some version hints.

VS Code Environment: Version: 1.33.1 (user setup) Commit: 51b0b28134d51361cf996d2f0a1c698247aeabd8 Date: 2019-04-11T08:27:14.102Z Electron: 3.1.6 Chrome: 66.0.3359.181 Node.js: 10.2.0 V8: 6.6.346.32 OS: Windows_NT x64 10.0.17763

Extension: Name: Markdown PDF Id: yzane.markdown-pdf Description: Convert Markdown to PDF Version: 1.2.0 Publisher: yzane

[JoFrMueller]

With VS Code Version 1.32 relative CSS paths are still working. So it seems a breaking change was introduced with 1.33.

[wkt84]

I also have this issue.

I think the cause is following code. https://github.com/yzane/vscode-markdown-pdf/blob/b1e5f5bc18c16d6ac40583ae7897c6e81b075723/extension.js#L716

From version 1.33, vscode.Uri.parse(href) returns file URI scheme such as file:///relative_path.css when href is a relative path such as relative_path.css. (Version 1.32 returns the same string as href)

Change the following line https://github.com/yzane/vscode-markdown-pdf/blob/b1e5f5bc18c16d6ac40583ae7897c6e81b075723/extension.js#L727 to

if (path.isAbsolute(href)) {

, then it worked.

Here is my version info. Version: 1.37.0 (user setup) Commit: 036a6b1d3ac84e5ca96a17a44e63a87971f8fcc8 Date: 2019-08-08T02:33:50.993Z Electron: 4.2.7 Chrome: 69.0.3497.128 Node.js: 10.11.0 V8: 6.9.427.31-electron.0 OS: Windows_NT x64 10.0.17763

[grigio]

@wkt84 I <3 you I hope it will be fixed

[EricCoteReact]

I also have the same problem. I hope this will be fixed soon.

[ralphsmith80]

Same issue for me.

[error-0x29A]

Broken for me too. I used to use the fix wkt84 recommended but it stopped working lately.

If I have a style specified in the settings, like example.css ,

If I mess around in the same fixHref function that wkt84 did (that fix no longer works for me) in extension.js, I can force this to work as a test by making sure no matter what that this is what is returned: return href.toString(); I believe doing that is simply forcing it to return exactly verbatim what is typed in the settings.

Given that, it appears to be possible, just needs someone to craft an elegant way to do that while preserving the rest of the logic/settings instead of brute forcing it like I did with the test.