codecamp

Vue.js SSR 在非 Node.js 环境中使用

vue-server-renderer 在默认构建时,会预先假定有一个 Node.js 环境,这使得它在其他 JavaScript 环境(如 PHP V8Js Oracle Nashorn 中无法使用。在 2.5+ 版本中,我们把那些基本上与环境无关的构建,编译到 vue-server-renderer/basic.js 中,这使得它可以在上述环境中使用。

对于所有环境,必须要预先在环境中模拟 globalprocess 对象,以及将 process.env.VUE_ENV 设置为 "server" 和将 process.env.NODE_ENV 设置为 "development""production"

在 Nashorn 环境下,可能还需要使用 Java 原生定时器,来为 PromisesetTimeout 提供 polyfill。

php-v8js 的示例用法:

<?php
$vue_source = file_get_contents('/path/to/vue.js');
$renderer_source = file_get_contents('/path/to/vue-server-renderer/basic.js');
$app_source = file_get_contents('/path/to/app.js');


$v8 = new V8Js();


$v8->executeString('var process = { env: { VUE_ENV: "server", NODE_ENV: "production" }}; this.global = { process: process };');
$v8->executeString($vue_source);
$v8->executeString($renderer_source);
$v8->executeString($app_source);
?>

// app.js
var vm = new Vue({
  template: `<div>{{ msg }}</div>`,
  data: {
    msg: 'hello'
  }
})


// 通过 `vue-server-renderer/basic.js` 暴露
renderVueComponentToString(vm, (err, res) => {
  print(res)
})
Vue.js SSR Head 管理
Vue.js SSR API 参考文档
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

Vue SSR api 参考手册

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }