Использование интерполяции с html-webpack-plugin - PullRequest
Новая
       11

Использование интерполяции с html-webpack-plugin

0 голосов
/ 26 октября 2018

Мне нужно вставить значения типа ${variable} в мой файл index.html.Я использую html-webpack-plugin, и все работает как положено, пока я не добавлю такое значение.

Это файл, который будет добавлен в Marketo, поэтому мне нужно иметь возможность использовать такие переменные внутри тега стиля, который находится на этой странице.Переменные не являются javascript, но я думаю, что это проблема с javascript, поэтому я поместил их в тег сценария, чтобы помочь устранить проблему.

index.html : 

<script>
    var x = "John"
    var y = `hello, ${x}`
</script>

config для html-webpack-plugin: 

 new HtmlWebpackPlugin(      
    {
        title: 'Index',
        filename: 'index.html',
        template: 'src/index.html',
        inject: true,
    }
)

Когда я пытаюсь скомпилировать страницу с этим синтаксисом на странице, я получаю следующую ошибку: 

ERROR in Template execution failed: ReferenceError: x is not defined

ERROR in   ReferenceError: x is not defined

  - index.html:100
    /Users/vernb/Code/src/index.html:100:    10

  - index.html:103 ./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html.module.exports
    /Users/vernb/Code/src/index.html:103:    3

  - index.js:284 Promise.resolve.then
    [lps-the-good-one]/[html-webpack-plugin]/index.js:284:18

  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7

1 Ответ

0 голосов
/ 27 октября 2018

Вам необходимо предоставить HtmlWebpackPlugin с templateParameters шаблон должен отображаться: 

new HtmlWebpackPlugin(      
    {
        title: 'Index',
        filename: 'index.html',
        template: 'src/index.html',
        templateParameters: { x: 'Value of x' }
        inject: true,
    }
)
...