0

I would like to use Prism in my Rails 7 project to highlight code in specific pages.

To make that:

  1. I downloaded the Development version of Prism for Markup + HTML + ..., CSS, C-like, and JavaScript languages, and with all the available plugins.
  2. I imported the Prism library in Rails 7 by following the Path 2: Download css and js files into your vendor folder blog post.

Now, in my Rails project I've these files:

project
> vendor
  > javascript
    > prism.js
  > stylesheet
    > prism.css

I also changed relevant files by adding Prism-related references:

# config/importmap.rb
pin 'prism', to: 'prism.js'

# app/javascript/application.js
import 'prism'

# app/assets/stylesheets/application.css.scss
@import 'stylesheet/prism';

To verify code highlighting, in a my test.html.erb template file I added the following:

<pre><code class="language-css line-numbers">
  p {
    color: red;
    text-align: center;
  }
</code></pre>

But when I render that page then in the browser console I get the error Uncaught TypeError: Prism.languages.css.selector.inside is undefined.

How to solve the problem?

2
  • 1
    select "CSS Extras" when downloading Commented Feb 12, 2024 at 2:40
  • I wrote a gem and just released the latest version of prism.js you can also use it that way Commented Mar 2, 2024 at 6:49

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.