[Feature request] Code Import single lines

[vordimous]

Clear and concise description of the problem

Allow the same code line selection for imports as for highlighting. This will make adding instructions from runnable files easier since there may be many different lines in a bash script, for instance, that are needed to run a test but not needed to be displayed to the user.

Will render: @[code{1-1}](../foo.js)
Doesn't render: @[code{1}](../foo.js)
Doesn't render: @[code{2,4}](../foo.js)

Suggested solution

You could add the same code line selection for highlighting lines as for imported code blocks.

Alternative

No response

Additional context

No response

[Mister-Hope]

I don't think the first case is needed, why do you need to import one single line from other files instead of direct writing that?
Also I don't think importing pieces and merging them is a common feature.

You can use include feature with vuepress-plguin-md-enhance inside code blocks as a workaround, or you may edit and release a markdown-it plugin yourself.

[vordimous]

@Mister-Hope The use case for single-line import is that we have many different short samples to display to the user. We have them defined in runnable scripts where we display individual steps for the user to follow. This way, the code we test and the code the user uses are the same. Many of those steps are just one line of code.

Please consider at least single line imports if possible.

[Mister-Hope]

Tbh, the first one does have workaround, didn't it?

Anyway contribution welcome, I don't think any disadvantages to support it.

[vordimous]

yes you can use a range that has the same line number @[code{11-11}](.). This isn't a blocking issue that I can think of.

[Mister-Hope]

We are closing this as we support 1- and -5 (meaning "1 to end" and "1-5").

Supporting both 3- and 3 may confuse the user.

[Mister-Hope]

Oh wait, I read again your original request, it seems you want something like:

@[code{2,4-5,6}](../foo.js)

Code region is better than setting with lines, as the file content may change through time, you can use it with https://plugin-md-enhance.vuejs.press/guide/include.html as an workaround.

The include plugin has highest priority (even before code blocks), so you can probably use:

```js
<!-- @include: ./foo.js{1} -->
<!-- @include: ./foo.js{2-4} -->
<!-- @include: ./foo.js#part1 -->
```

If the code block is indented, you still need to ensure that the comment is at the start of the line:

  ```js
<!-- @include: ./foo.js{1} -->
  ```

[Mister-Hope]

I do not think we need to support @[code{2,4-5,6}](../foo.js), waiting for @meteorlxy opinion before finally closing this issue

[vordimous]

Thank you @Mister-Hope, I like the @include option since it allows for code highlighting separate from the import and the snippet feature is nice.

I did not find the individual line support you mention to work:

<!-- @include: ./foo.js{1} -->
<!-- @include: ./foo.js{2-4} -->
<!-- @include: ./foo.js#part1 -->

    "vue": "^3.3.4",
    "vuepress": "2.0.0-beta.67",
    "vuepress-theme-hope": "2.0.0-beta.238"

[Mister-Hope]

I do not think we need to support @[code{2,4-5,6}](../foo.js), waiting for @meteorlxy opinion before finally closing this issue

CC @meteorlxy

[Mister-Hope]

Thank you @Mister-Hope, I like the @include option since it allows for code highlighting separate from the import and the snippet feature is nice.

I did not find the individual line support you mention to work:

<!-- @include: ./foo.js{1} -->
<!-- @include: ./foo.js{2-4} -->
<!-- @include: ./foo.js#part1 -->

    "vue": "^3.3.4",
    "vuepress": "2.0.0-beta.67",
    "vuepress-theme-hope": "2.0.0-beta.238"

You can report issues in vuepress-theme-hope repo.

[vordimous]

You can report issues in vuepress-theme-hope repo.

I created a ticket to track @include here: vuepress-theme-hope/vuepress-theme-hope#3855