Приветствую!
Не получается в webpack.config.js првильно подключить библиотеку highlight.js .
Подключил в webpack.config.js highlight.pack.js
const path = require('path');
const HtmlWebPackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const autoprefixer = require('autoprefixer');
module.exports = {
entry: [
"./src/libs/highlight/highlight.pack.js",
"./src/js/app.js"
],
output: {
filename: "bundle.js",
},
devtool: "inline-source-map",
optimization: {
minimize: false
},
module: {
// loaders: [
// // {
// // test: /\.md$/,
// // loader: 'html!highlight!markdown',
// // include: PATHS.markdown
// // }
// {
// test: /\.html$/,
// loader: 'html!highlight!markdown',
// include: "./dist/index.html"
// }
// ],
rules: [
{
test: /\.sass$/,
use: [
{
loader: "style-loader"
},
{
loader: "css-loader"
},
{
loader: "postcss-loader",
options: {
autoprefixer: {
browsers: ["last 2 versions"]
},
plugins: () => [
autoprefixer
]
},
},
{
loader: "sass-loader",
}]
},
{
test: /\.pug$/,
loader: "pug-loader",
options: {
pretty: true
}
},
]
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/index.pug",
filename: "./index.html",
inject: false
}),
]
};
В итоге браузер выдает ошибку:
|
Код:
|
highlight.pack.js:308 Uncaught ReferenceError: hljs is not defined
at Object. (highlight.pack.js:308)
at __webpack_require__ (bootstrap:19)
at Object.n (bootstrap:83)
at __webpack_require__ (bootstrap:19)
at bootstrap:83
at bootstrap:83 |
Использовал highlight-loader, не работает и не понятна инструкция использования:
module: {
loaders: [
{
test: /\.md$/,
loader: 'html!highlight!markdown',
include: PATHS.markdown
}
]
}
// Reading HTML from parsed markdown
var highlightedMarkdown = require('html!highlight!markdown!./README.md');
// Reading a file's raw contents and auto-detecting the language
var highlightedRaw = require('html!highlight?raw=true!./example-script.js');
// Reading a file's raw contents and specifying the language
var highlightedRawCss = require('html!highlight?raw=true&lang=css!./example-stylesheet.css');
// Reading HTML from a template loader
var highlightedRenderedJadeTemplate = require('html!highlight?exec!apply!jade!./index.jade')
Как можно добавить это корректно в мой webpack.config.js или есть другой способ?
Вот ссылка на мой github
Все пакеты устанавливаются командой "yarn", сборка - "yarn run build".
