怎么搭建ssr服务器 ssr一键搭建脚本最新(3)

怎么搭建ssr服务器

修改package.json文件，在scripts属性中添加以下代码:

"build:client": "vue-cli-service build", "build:server": "cross-env WEBPACK_TARGET=node vue-cli-service build --mode server", "build:win": "npm run build:server && move dist\\vue-ssr-server-bundle.json bundle && npm run build:client && move bundle dist\\vue-ssr-server-bundle.json"

修改main.js、router/index.js、store/index.js文件

1、main.js

// main.jsimport Vue from "vue";import App from "./App.vue";import { createRouter } from "./router";import { createStore } from "./store";Vue.config.productionTip = false; export function createApp() { const router = createRouter(); const store = createStore(); const app = new Vue({ router, store, render: h => h(App) }) return { app, router, store }}

2、router/index.js

// router/index.jsimport Vue from "vue";import VueRouter from "vue-router";import Home from "../views/Home.vue";Vue.use(VueRouter);const routes = [ { path: "/", name: "Home", component: Home },];export function createRouter() { return new VueRouter({ mode: "history", base: process.env.BASE_URL, routes });}

3、store/index.js

// store/index.jsimport Vue from "vue";import Vuex from "vuex";Vue.use(Vuex);export function createStore() { return new Vuex.Store({ state: {}, mutations: {}, actions: {}, modules: {} })}

最后一步，运行命令:
$ npm run build:win
构建完成后运行命令:
$ node server

上述就是怎么搭建ssr服务器 以及 ssr一键搭建脚本最新的全面介绍了，希望给IT袋网的网友们带来一些相关知识。