Html-webpack-plugin: FreeMarker template engine ReferenceError

Created on 20 Mar 2017  路  6Comments  路  Source: jantimon/html-webpack-plugin

template.ftl (FreeMarker template engine) page has an output variable ${outputValue}
Run the webpack prompt "ERROR in Template execution failed: ReferenceError: outputValue is not defined"

Most helpful comment

So outputValue is dynamic / coming from the server, you don't want html-webpack-plugin to change it.

I can see two solutions (I think the second one is better):

  • use html-loader instead of ejs-loader:
{
  test: /\.ftl$/,
  loader: "html-loader"
},
  • escape outputValue: ${outputValue} -> <%= "\\${outputValue}\\>" %>

All 6 comments

Are you still having that error?

If so can you give us your template.ftl, webpack.config.js and the error stack trace

index.ftl

<!DOCTYPE html>
<html>
<head>
    <title>index</title>
</head>
<body>
   this is FreeMarker template engine,
   Read data from server -- ${outputValue}
</body>
</html>

webpack.config.js

var webpack = require("webpack");
var HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    entry: {
        index: "./dev/zpdj/js/index.js"
    },
    output: {
        path: __dirname,
        filename: "built/zpdj/js/[name].js"
    },
    module: {
        loaders: [
            {
                test: /\.json$/,
                loader: "json-loader"
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader'
            },
            {
                test: /\.css$/,
                loader: 'css-loader!postcss-loader'
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            filename: "./html2/index.ftl",
            template: "./html/index.ftl"
        })
    ]
}

error stack trace

                 Asset     Size  Chunks             Chunk Names
built/zpdj/js/index.js  2.95 kB       0  [emitted]  index
     ./html2/index.ftl  1.07 kB          [emitted]
   [0] ./dev/zpdj/js/index.js 295 bytes {0} [built]

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

ERROR in   ReferenceError: outputValue is not defined

  - index.ftl:17224
    D:/Projects/Projects.Solution/SweetsXob/SweetsXob.Test/zhongpu/html/index.ftl:17224:10

  - index.ftl:17227 module.exports
    D:/Projects/Projects.Solution/SweetsXob/SweetsXob.Test/zhongpu/html/index.ftl:17227:3

  - index.js:265
    [zhongpu]/[html-webpack-plugin]/index.js:265:16

  - util.js:16 tryCatcher
    [zhongpu]/[bluebird]/js/release/util.js:16:23

  - promise.js:512 Promise._settlePromiseFromHandler
    [zhongpu]/[bluebird]/js/release/promise.js:512:31

  - promise.js:569 Promise._settlePromise
    [zhongpu]/[bluebird]/js/release/promise.js:569:18

  - promise.js:606 Promise._settlePromiseCtx
    [zhongpu]/[bluebird]/js/release/promise.js:606:10

  - async.js:138 Async._drainQueue
    [zhongpu]/[bluebird]/js/release/async.js:138:12

  - async.js:143 Async._drainQueues
    [zhongpu]/[bluebird]/js/release/async.js:143:10

  - async.js:17 Immediate.Async.drainQueues
    [zhongpu]/[bluebird]/js/release/async.js:17:14


Child html-webpack-plugin for "html2\index.ftl":
       [0] ./~/lodash/lodash.js 540 kB {0} [built]
       [1] (webpack)/buildin/global.js 509 bytes {0} [built]
       [2] (webpack)/buildin/module.js 517 bytes {0} [built]
       [3] ./~/html-webpack-plugin/lib/loader.js!./html/index.ftl 594 bytes {0} [built]

Thanks for your help

So outputValue is dynamic / coming from the server, you don't want html-webpack-plugin to change it.

I can see two solutions (I think the second one is better):

  • use html-loader instead of ejs-loader:
{
  test: /\.ftl$/,
  loader: "html-loader"
},
  • escape outputValue: ${outputValue} -> <%= "\\${outputValue}\\>" %>

Thank you very much for the perfect solution

Thanks @mastilver

In my case, this rendered output -
<meta name="keywords" content="${keywords}"></meta>

was correctly defined in the source as this -
<meta name="keywords" content="<%= '\${keywords}' %>"></meta>

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

yyx990803 picture yyx990803  路  4Comments

lcxfs1991 picture lcxfs1991  路  4Comments

GerkinDev picture GerkinDev  路  3Comments

MatthewKosloski picture MatthewKosloski  路  3Comments

rokoroku picture rokoroku  路  3Comments