Я пытаюсь использовать svg-inline-loader
в многостраничном проекте.
Когда я использую его на странице индекса, он отлично работает
<%= require('!svg-inline- loader!../../img/toolbar/'+firstBtn.iconName+'.svg') %>
, но когда я пытаюсь вставить его в частичный файл, он не работает Я получаю
Html Webpack Plugin:
ReferenceError: require is not defined
- lodash.templateSources[16]:7 eval
lodash.templateSources[16]:7:50
- loader.js:31 eval
[search.html?..]/[html-webpack-plugin]/lib/loader.js:31:106
- loader.js:36 module.exports
[search.html?..]/[html-webpack-plugin]/lib/loader.js:36:3
- index.js:422
[site.local]/[html-webpack-plugin]/index.js:422:16
Моя конфигурация веб-пакета
{
test: /\.html$/,
include: [path.resolve('src/html/partials/')],
use: ['html-loader']
},
new HtmlWebpackPlugin({
filename: 'index.html',
template: './html/pages/index.html',
chunks: ['main']
}),
new HtmlWebpackPlugin({
filename: 'login.html',
template: './html/pages/login.html',
chunks: ['login', 'main']
}),
new HtmlWebpackPlugin({
filename: 'search.html',
template: './html/pages/search.html',
chunks: ['main']
}),
моя страница поиска
<% var toolbar = {
firstBtn: {
title: "City",
anchor: "login.html",
iconName: "city"
}
} %>
<%= _.template(require('../partials/header.html'))%>
<div class="container">
<div class="search">
<%= _.template(require('../partials/toolbar.html'))(toolbar)%>
</div>
и toolbar.html
, где я хочу загрузить переменные панели инструментов
<div class="toolbar">
<%= require('!svg-inline-
loader!../../img/toolbar/'+firstBtn.iconName+'.svg') %>
</div>
Как решить эту проблему с помощью HtmlWebpackPlugin. Часть заголовка работает нормально, прежде чем вводить svg-inline-loader