Javascript Vue.js中具有服务器端渲染的单文件组件
我正在尝试使用服务器端渲染构建我的应用程序，但我的服务器代码中存在以下问题：Javascript Vue.js中具有服务器端渲染的单文件组件,javascript,vue.js,server-side-rendering,Javascript,Vue.js,Server Side Rendering,我正在尝试使用服务器端渲染构建我的应用程序，但我的服务器代码中存在以下问题： function (exports, require, module, __filename, __dirname) { <template> ^^^^^^^^^ 我想这是一个文件组件的问题。有没有办法避免这种情况？如何使用express server渲染单个文件组件 这是我的服务器配置： const Vue = require('vue') const App = require('./src/App
function (exports, require, module, __filename, __dirname) {
<template>
^^^^^^^^^
const Vue = require('vue')
const App = require('./src/App.vue');
const server = require('express')();
const renderer = require('vue-server-renderer').createRenderer();
server.get('*', (req, res) => {
const app = new Vue({
el: '#app',
data: {
url: req.url
},
template: '<App/>',
components: { App }
})
renderer.renderToString(app, (err, html) => {
if (err) {
res.status(500).end('Internal Server Error')
return
}
res.end(`
<!DOCTYPE html>
<html lang="en">
<head><title>Hello</title></head>
<body>${html}</body>
</html>
`)
})
})
server.listen(8080);
现在有一个名为express vue的包可以实现这一点 我在这方面取得了巨大的成功，它仍然支持组件、mixin等 其思想是简单地将Node+Express用于控制器和模型，将Vue.js用于视图 danmademe提供 从npm页面： 用法 这是所需的最低设置。如果您不提供vueVersion，它将在项目发布时使用最新版本。如果没有rootPath，它将假定root是node_模块的父目录
var expressVue = require("express-vue");
var app = express();
const expressVueMiddleware = expressVue.init();
app.use(expressVueMiddleware);
router.get('/', (req, res, next) => {
const data: {
otherData: 'Something Else'
};
req.vueOptions: {
head: {
title: 'Page Title',
metas: [
{ property:'og:title', content: 'Page Title'},
{ name:'twitter:title', content: 'Page Title'},
]
}
}
res.renderVue('main.vue', data, req.vueOptions);
})