question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

support nextjs <style> tag attributes in highlighting

See original GitHub issue

this extension works great for nextjs <style jsx> tag, but breaks for global styles: file

Could you add support for this?

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:23 (12 by maintainers)

github_iconTop GitHub Comments

1reaction
Pika-Poolcommented, Dec 17, 2021

This was my first merged PR. Thanks you so much for ur help @jasonwilliams. Really enjoyed contributing. Will try and contribute more in future

1reaction
Pika-Poolcommented, Dec 16, 2021

Yes, I’m still looking into it. Just stuck with some work.

that’s easily fixed by changing the asterisk to a plus. Good spot

It still has the same issue. It’ll be a match if only a global attribute is added. I came up with this final solution: https://regex101.com/r/17PV9d/1/ . It works on vscode too. screenshot: Screenshot

I believe the engine used in find and the one used for syntax highlighting are 2 different engines. Find is ripgrep, syntax highlighting is https://github.com/kkos/oniguruma

I actually tried my previous solution with https://github.com/atom/node-oniguruma, a node module for oniguruma. It actually gives 2 captures, even if I use a non-capturing group (?:). I don’t understand how to omit/define the first group in the beginCaptures.

Anyway, for now, I guess the above solution works. I’ll put a PR for that.

Read more comments on GitHub >

github_iconTop Results From Across the Web

The best styling options for Next.js - LogRocket Blog
Choosing a styling option is dependent on many factors. Thankfully, Next.js offers built-in support for CSS in a variety of different ways.
Read more >
Styling Next.js with Styled JSX
This blog post will help you get started with using Styled JSX in Next.js. ... By adding just a single jsx attribute to...
Read more >
Building a Code Snippet Highlighter in Next.js
The syntax highlighter will offer code highlighting for various languages and a pop-up that shows when code has been copied. This is useful...
Read more >
Syntax highlighting with Prism and Next.js - DEV Community ‍ ‍
PrismJS is the ideal choice for syntax highlighting with JavaScript right in the browser. PrismJS has support for all modern browsers. It has...
Read more >
Comparing Styling Methods In Next.js - Smashing Magazine
To serve a wider audience, Next.js supports a myriad of ways to style your components. Whether you belong to the Utility first or...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found