Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings

Feat: Enhance code snippets import continuation of #538 #750

Copy link
Copy link
Closed
@ijpatricio

Description

@ijpatricio
Issue body actions

Feature request

What problem does this feature solve?

When documenting an existing code project, if we later change some code on that, which is being imported on Vuepress docs, it gets out of sync!

So this Feature Request is extending more functionality on top of #538 (and somewhat similar to #612 but much simpler and more flexibility)

What does the proposed API look like?

Currently we have

import contents from somefile.js, bg highlight line 20, syntax highlight as file extension, i presume

<<< @/../project/somefile.js{20}

Proposition on #538 is

//to extract lines 1-10 from somefile.js, syntax highlight as js, and bg highlight lines 1 and 4

@[code{1-10} js{1,4}](../somefile.js)

That's great, and may continue to exist.

For making more dynamic approach, we could use "text-markers" (that could have * as wildcard :) )

// on somefile.js, 
// extract from first line that contains text 'some text',
// until first line that contains text 'another text'
// syntax highlight as js and bg highlight lines that contain 'myFuncName' or 'return someVar'

@[codesearch{'some text'-'another text'} js{'myFuncName','return someVar'}](../somefile.js)

if possible two more optional arguments (some code ommited for clarity)

// Preserve the line numbering matching the original file
// Means keep numbering 50-60 (like on imported file) instead of 1-11

@[codesearch  (...)     filenum{true}](../somefile.js)
// to the found markers, add padding top and bottom (that could be also negative numbers)
// say 'begin-mark' is line 50, start on 46, and if 'end-marker' is 60, finish on 58

@[codesearch (...)   padding{4, -2}](../somefile.js)

How should this be implemented in your opinion?

Pseudo-algorithm to implement it

find first occurence of 'some text', say this is originalLine=50, keep this as snippetLine=1
find first occurence of 'another text', say originalEndLine=60, snippetEndLine=11

if not both markers found, throw exception
if (originalEndLine - originalLine < 1) throw exception

highlight line with occurrence of `myFuncName()`
highlight line with occurrence of `return someVar`

Are you willing to work on this yourself?**

Yes I am. I will need some guidance with webpack related matters.

I do lots of stuff with VueJS for webapps, with SFC, started renderless components few weeks ago and so on... but webpack related, I don't have significant experience.

Going to clone and yarn link to try out locally, what goes on, try to hack something.

Would love to hear your feedback.

Thanks!

Metadata

Metadata

Assignees

No one assigned

    Labels

    type: feature requestRequest to add a new featureRequest to add a new featureversion: nextPlanned to do or already included in the next(1.0.0) versionPlanned to do or already included in the next(1.0.0) version

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions

      Morty Proxy This is a proxified and sanitized view of the page, visit original site.