Клиентский Prism.js с npm

Question

Я пытаюсь использовать подсветку синтаксиса Prism.js на стороне клиента в качестве npm зависимость, а не загружать его из <script src="..."> теги. Вот ссылка на призму в package.json

{
    "dependencies": {
        "prismjs": "^1.5.1"
    }
}

И то, как я пытаюсь использовать его в своем коде

import Prism from 'prismjs'
Prism.highlightAll();

Это дает следующие результаты:

• Токенизация работает для базовых языков (html, javascript...)
• Токенизация не работает для других определенных языков (lua, handlebars...)
• Для всех языков синтаксическая раскраска не применяется (файл CSS не загружен)

Так что мне интересно

• Существуют ли другие языковые пакеты (например, prismjs-handlebars)?
• Существуют ли тематические пакеты (например, prism-okaidia), которые импортировали бы css?

-

TL; DR

Как загрузить / использовать Prism.js на стороне клиента из npm а не из тегов скрипта?

Answer 1

В конце концов я нашел способ сделать это.

1. Добавить style-loader а также css-loader в package.json

{
    "dependencies": {
        "style-loader": "^0.13.1",
        "css-loader": "^0.23.0",
        "prismjs": "^1.5.1"
    }
}

2. Загрузите CSS-файлы в webpack.config.js

module: {
    loaders: [
        {
            test: /\.css/,
            loader: 'style-loader!css-loader'
        }
    ]
}

3. Импортируйте нужные файлы в приложение

import Prism from 'prismjs'
import 'prismjs/themes/prism-okaidia.css'
import 'prismjs/components/prism-handlebars.min.js'
import 'prismjs/components/prism-lua.min.js'

Prism.highlightAll();