安装 cross-env

yarn add -D cross-env

安装 html-webpack-plugin

yarn add -D html-webpack-plugin

安装 webpack-merge

yarn add -D webpack-merge

安装 vue-server-renderer

yarn add -D vue-server-renderer

测试

server.js

const renderVueComponentToString = require("vue-server-renderer/basic.js");
const serverBundle = require("./dist/server-bundle");

console.log("server is running ...");

const context = {
  url: "/"
};
const promise = serverBundle.default(context);

promise
  .then((resolve, reject) => {
    console.log("promise resolved");
    const vm = resolve;
    renderVueComponentToString(vm, (err, res) => {
      if (err) {
        console.log(err);
        return;
      }
      console.log(res);
    });
  })
  .catch(rejected => {
    console.log(rejected);
  });

运行结果

➜  webapp git:(j2v8-version) ✗ yarn dev
yarn run v1.13.0
$ node server
server is running ...
cntext=> { url: '/' }
promise resolved
<div data-server-rendered="true"><h1>Hello World! Vue,j2v8!</h1></div>
Done in 0.69s.

Vue SSR 配合Java的Javascript引擎j2v8实现服务端渲染3配置webpack支持ssr的更多相关文章

  1. Vue SSR 配合Java的Javascript引擎j2v8实现服务端渲染2创建Vue2+webpack4项目

    前提 安装好nodejs并配置好环境变量,最好是 node10,https://nodejs.org/en/download/ 参考我之前的文章 debian安装nodejs Yarn &&a ...

  2. Vue SSR配合Java的Javascript引擎j2v8实现服务端渲染1概述

    原文地址 http://www.terwergreen.com/post/vue-ssr-j2v8-1.html 初步实现方案探索(Node环境) // 第 1 步:创建一个 Vue 实例 const ...

  3. Vue SSR 配合Java的Javascript引擎j2v8实现服务端渲染4支持构建bundle

    安装 webpack-node-externals yarn add -D webpack-node-externals

  4. vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器

    vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器SSR 完全指南https://cn.vuejs.org/v2/guide/ssr.html在 2.3 发布后我们发布了一份完 ...

  5. 使用 PHP 来做 Vue.js 的 SSR 服务端渲染

    对于客户端应用来说,服务端渲染是一个热门话题.然而不幸的是,这并不是一件容易的事,尤其是对于不用 Node.js 环境开发的人来说. 我发布了两个库让 PHP 从服务端渲染成为可能.spatie/se ...

  6. 改造@vue/cli项目为服务端渲染-ServerSideRender

    VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...

  7. 服务端渲染 数据驱动 不是渲染后的网页,而是一个由html和Javascript组成的app ssr 隐藏接口服务器

    小结: 1. 服务端渲染主要的工作是把组件渲染为服务器端的 HTML 字符串,将它们直接发送到浏览器,最后将静态标记"混合"为客户端上完全交互的应用程序. 服务器给到客户端的已经是 ...

  8. Vue 爬坑之路(十一)—— 基于 Nuxt.js 实现服务端渲染(SSR)

    直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 ...

  9. Vue 服务端渲染(SSR)

    什么是服务端渲染? 简单理解是将组件或页面通过服务器生成html字符串,再发送到浏览器,最后将静态标记"混合"为客户端上完全交互的应用程序. 服务端渲染的优点 更好的SEO,搜索引 ...

随机推荐

  1. 12C新特性--Application Continuity

    Application Continuity特性可以在中断后恢复受影响的数据库会话的任务,从而让终端用户和应用程序感觉不到中断的发生.Application Continuity执行恢复的过程是在应用 ...

  2. sql随机查询数据语句(NewID(),Rnd,Rand(),random())

    SQL Server: 代码如下 复制代码 Select TOP N * From TABLE Order By NewID() NewID()函数将创建一个 uniqueidentifier 类型的 ...

  3. Android studio的主题颜色修改

    1.选择喜欢的主题 http://color-themes.com/?view=index 好几十款,总有一款你喜欢 2.下载你喜欢的主题,注意是jar文件 .File -> Import Se ...

  4. 【转】Django中使用POST方法获取POST数据

    1.获取POST中表单键值数据 如果要在django的POST方法中获取表单数据,则在客户端使用JavaScript发送POST数据前,定义post请求头中的请求数据类型: xmlhttp.setRe ...

  5. oracle数据泵笔记

    1.创建目录 查询已有目录:select * from dba_directories 创建并授权: CREATE DIRECTORY dump_dir AS '/tmp/' grant read,w ...

  6. js 规范

    1.原型链的弊端是不支持多重继承.记住,原型链会用另一类型的对象重写类的 prototype 属性 2.注意:调用 ClassA 的构造函数,没有给它传递参数.这在原型链中是标准做法.要确保构造函数没 ...

  7. centos7中端口及服务对应情况(笔记)

    25 postfix服务 111 rpcbind.socket服务

  8. ubuntu安装anaconda后,终端输入conda,出现未找到命令

    解决办法: 终端输入:vim  ~/.bashrc 键盘大写“G”,在最末端输入:export PATH=~/anaconda2/bin:$PATH 使其生效:source  ~/.bashrc 打印 ...

  9. eclipse java ee jsp tomcat Server文件夹给删了,怎么办?

    右键 选择属性 选择Switch location 就可以了

  10. 磨刀不误砍柴工——统一日志系统 Log4Net/ExceptionLess

    本文版权归博客园和作者吴双本人共同所有,转载和爬虫必须注明原文地址:www.cnblogs.com/tdws . 一.   写在前面 本文Log4Net介绍了基础的方式,大数据量生产环境不能使用,中等 ...