Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hot reload doesn't work in conjunction with markdown-it-include plugin #1616

Open
2 tasks done
aliniacb opened this issue May 23, 2019 · 8 comments
Open
2 tasks done

Comments

@aliniacb
Copy link

aliniacb commented May 23, 2019

  • I confirm that this is an issue rather than a question.

Bug report

When changing imported files supported via markdown-it-include reload isn't triggered

Steps to reproduce

Install markdown-it-include via extendMarkdown option in config.js

// in my config.js
markdown: {
        lineNumbers: true,
        extendMarkdown: md => {
            md.use(require('markdown-it-include'), 'docs/api/');
        }
    }

What is expected?

Hot reload should be triggered and files recompiled

What is actually happening?

Whenever I change content in a file that is being imported nothing happens.
I have also tried adding the imported files in the extraWatchFiles and the hot reload is triggered but it only refreshes the page without compiling.

To be able to see the changes I have to hit save in the parent file (which cannot be an imported file by itself otherwise it won't work).

Other relevant information

  • My VuePress version is higher than 1.0.0-alpha.47, the following is the output of npx vuepress info in my VuePress project:
  System:
    OS: macOS 10.14.5
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
  Binaries:
    Node: 11.3.0 - ~/.nvm/versions/node/v11.3.0/bin/node
    Yarn: 1.15.2 - /usr/local/bin/yarn
    npm: 6.9.0 - ~/.nvm/versions/node/v11.3.0/bin/npm
  Browsers:
    Chrome: 74.0.3729.169
    Firefox: Not Found
    Safari: 12.1.1
  npmPackages:
    @vuepress/core:  1.0.0-alpha.48 
    @vuepress/theme-default:  1.0.0-alpha.48 
    vuepress: ^1.0.0-alpha.48 => 1.0.0-alpha.48 
  npmGlobalPackages:
    vuepress: 0.14.11

@markchagers
Copy link

markchagers commented Oct 21, 2020

I can confirm that this issue still occurs in vuepress@latest
In fact, even rebuilding the project won't show the updated contents of the included file. I have to remove the import line, save the file and re-add the import for the changed file contants to show up in the rendered page.

@tyrw
Copy link

tyrw commented Feb 16, 2021

Confirmed as well; this is quite a blocker for larger documentation sets, and unfortunately makes the include feature mostly unusable.

@InfoSec812
Copy link

I can confirm this is still an issue in 1.8.2 and I am pretty certain I know why. Even when you set up extraWatchFiles, the parent page of the include doesn't get modified and so it doesn't get re-rendered. I believe we would need some mechanism for VuePress to pre-scan for include files and trigger a re-render of the parent page instead. Not sure how that could be accomplished though.

@cjcandctr
Copy link

cjcandctr commented Oct 18, 2021

I simply forget to use build-in link extention in markdown files. So no need markdown-it-include plugin.

[Home](/) <!-- Sends the user to the root README.md -->
[foo](/foo/) <!-- Sends the user to index.html of directory foo -->
[foo heading](./#heading) <!-- Anchors user to a heading in the foo README file -->
[bar - three](../bar/three.md) <!-- You can append .md (recommended) -->
[bar - four](../bar/four.html) <!-- Or you can append .html -->

@alexfornuto
Copy link

I simply forget to use build-in link extention in markdown files. So no need markdown-it-include plugin.

[Home](/) <!-- Sends the user to the root README.md -->
[foo](/foo/) <!-- Sends the user to index.html of directory foo -->
[foo heading](./#heading) <!-- Anchors user to a heading in the foo README file -->
[bar - three](../bar/three.md) <!-- You can append .md (recommended) -->
[bar - four](../bar/four.html) <!-- Or you can append .html -->

I think we're talking about two different things. You're talking about a markdown link, and they're talking about embedding content from a markdown file in another markdown file. For example, this file is one of several that re-use content from this partial.

I've not commented on this issue but I've been watching it. I also experience this issue and would like to see it resolved.

@markchagers
Copy link

I think we're talking about two different things. You're talking about a markdown link, and they're talking about embedding content from a markdown file in another markdown file. For example, this file is one of several that re-use content from this

Actually the OP was talking about embedding code fragments in markdown files using the markdown-it plugin. When the embedded code changes, the generated p[ages should refresh to show the updated source code, but that doesn't happen.

@alexfornuto
Copy link

OK, embedded *. In any case, the behavior is the same in that it doesn't reload on change, and has nothing to do with markdown-formatted links.

@cjcandctr
Copy link

cjcandctr commented Oct 20, 2021

OK, embedded *. In any case, the behavior is the same in that it doesn't reload on change, and has nothing to do with markdown-formatted links.

Sorry for the confusion, but I've realize my mistake and did some research. I think ulivz provide a possible soution here #222, using the <content> component. I personally think it's a valid option but not as intuitive as the markdown-it-include does.

Besides, I can confirm the issue exists. Using markdown-it-include with vuepress, I have to update the reference(like this line !!!include(./embeddedFile.md)!!!), save the markdown, then update the reference back and save again to make the page render correctly.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants