/node_modules/lodash.template/index.js:1558 throw result； ^ SyntaxError: Unexpected token = 报错解决

最新推荐文章于 2024-10-29 16:30:28 发布

vieber

最新推荐文章于 2024-10-29 16:30:28 发布

阅读量554

点赞数 1

分类专栏：前端文章标签： Vue SSR 报错模板解析 htmlWebpackPlugin

本文链接：https://blog.youkuaiyun.com/sufubo/article/details/116462359

版权

前端专栏收录该内容

91 篇文章

订阅专栏

在使用vue-server-renderer编译时遇到一个问题，由于模板中存在`<%=htmlWebpackPlugin.options.loading.css%><%=htmlWebpackPlugin.options.loading.html%>`导致解析失败。报错信息包括SyntaxError: Unexpected token=。解决方案是删除这两行代码，从而成功编译并插入到`index.html`中。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

报错信息

node_modules/lodash.template/index.js:1558
    throw result;
    ^

SyntaxError: Unexpected token =
    at Function (<anonymous>)
    node_modules/lodash.template/index.js:1550:12

问题背景

使用vue-server-renderer编译，插入html到模版中

const fs = require('fs')
const {
    resolve
} = require('path')

const createBundleRenderer = require('vue-server-renderer').createBundleRenderer


// 读取`skeleton.json`，以`index.html`为模板写入内容
const renderer = createBundleRenderer(resolve(__dirname, './dist/skeleton.json'), {
    template: fs.readFileSync(resolve(__dirname, './index.html'), 'utf-8')
})

// 把上一步模板完成的内容写入（替换）`index.html`
renderer.renderToString({}, (err, html) => {
    if (err) {
        console.log('err:' + err);
    }
    fs.writeFileSync('index.html', html, 'utf-8')
})

原因

原来是原来html中有这样的代码

<%= htmlWebpackPlugin.options.loading.css %>
<%= htmlWebpackPlugin.options.loading.html %>

导致解析插入失败

 <!--vue-ssr-outlet-->

替换这个，把<%= htmlWebpackPlugin.options.loading.css %> <%= htmlWebpackPlugin.options.loading.html %>
删除掉就好了。