安装 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. MySQL权限和用户安全

    MySQL访问控制分为两个阶段阶段1: 检查用户是否可以连接到mysql server 阶段2: 检查用户执行的sql是否已经被授权

  2. MySQL在线删除多余的binlog文件

    如果你的MySQL搭建了主从同步 , 或者数据库开启了log-bin日志(MySQL默认开启) , 那么随着时间的推移 , 你的数据库data 目录下会产生大量的日志文件 ll /opt/mysql/ ...

  3. Kubernetes的ConfigMap解析

    ConfigMap功能在Kubernetes1.2版本的时候就有了,许多应用程序会从配置文件.命令行参数或环境变量中读取配置信息.这些配置信息需要与docker image解耦,你总不能每修改一个配置 ...

  4. [k8s]nginx-ingress配置4/7层测试

    基本原理 default-backend提供了2个功能: 1. 404报错页面 2. healthz页面 # Any image is permissable as long as: # 1. It ...

  5. Json返回结果为null属性不显示解决方法

    返回时null属性不显示:String str = JSONObject.toJSONString(obj); 返回为null属性显示:String str = JSONObject.toJSONSt ...

  6. 带cookie跨域问题的思路以及echo的解决方案

    问题起因 前后端分离,前端要访问后端资源,而且需要携带cookie信息,这时碰到了跨域问题.一开始以为设置为允许跨域allow_origins为即可.可是浏览器还是拦截的请求,于是查看跨域规则,原来跨 ...

  7. 【iCore4 双核心板】DEMO V1.0 测试程序发布

    iCore4 Demo V1.0程序说明 一.概要 本资料包含5个文件夹: 1.“arm”里是iCore4上arm的程序包,开发环境为KEIL5.17: 2.“fpga”里是iCore4上FPGA的程 ...

  8. 【iCore4 双核心板_ARM】例程六:IWDG看门狗实验——复位ARM

    实验原理: STM32内部包含独立看门狗,通过看门狗可以监控程序远行,程序运行错误时, 未在规定时间内喂狗,自动复位ARM.本实验通过按键按下,停止喂狗,制造程序运行 错误,从而产生复位. 核心代码: ...

  9. Linux expect 使用(免密登录跳板机)

    登录公司的跳板机是挺麻烦的事,首先要ssh,然后输入密码,有的公司可能还要动态密码,前两步操作都是固定的,所以能免去前两步的操作就会方便很多(线上出问题也能尽快登上去,免得紧张密码一直输错,哈哈哈). ...

  10. 查看SQL SERVER数据库的连接数

    1,查看连接到‘TestDB2’数据库的连接 select * from master.dbo.sysprocesses where dbid = DB_ID('TestDB2') *查询某个数据库用 ...