Vue SSR + Vuetify，“意外标识符”错误答案

【问题标题】：Vue SSR + Vuetify, "Unexpected identifier" errorVue SSR + Vuetify，“意外标识符”错误
【发布时间】：2019-11-11 19:22:52
【问题描述】：

我有 Vue、Vue-router、Vuex 和 Vuetify 的 SPA 项目。我尝试使用@akryum/vue-cli-plugin-ssr 将其修复为服务器端渲染。但我得到一个错误。

SyntaxError: Unexpected identifier
    at new Script (vm.js:80:7)
    at createScript (vm.js:264:10)
    at Object.runInThisContext (vm.js:316:10)
    at Module._compile (internal/modules/cjs/loader.js:670:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:718:10)
    at Module.load (internal/modules/cjs/loader.js:605:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:544:12)
    at Function.Module._load (internal/modules/cjs/loader.js:536:3)
    at Module.require (internal/modules/cjs/loader.js:643:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at r (/home/ns16/projects/my/vuejs/vue-articles-app_ssr-plugin/node_modules/vue-server-renderer/build.dev.js:9300:16)
    at Object.vuetify/lib (webpack:/external "vuetify/lib":1:0)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at Module../src/plugins/vuetify.js (src/plugins/vuetify.js:1:0)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at Module../src/main.js (app.js:777:74)
error during render url : /
/home/ns16/projects/my/vuejs/vue-articles-app_ssr-plugin/node_modules/vuetify/lib/index.js:1
(function (exports, require, module, __filename, __dirname) { import Vuetify from './components/Vuetify';
                                                                     ^^^^^^^

这是我的代码

src/main.js

import Vue from 'vue'

import './plugins/vuetify'
import App from './App.vue'
import { createRouter } from './router'
import { createStore } from './store'

Vue.config.productionTip = false

export async function createApp({ beforeApp = () => {}, afterApp = () => {} } = {}) {
    const router = createRouter()
    const store = createStore()

    await beforeApp({ router, store })

    const app = new Vue({ router, store, render: h => h(App) })
    const result = { app, router, store }

    await afterApp(result)

    return result
}

src/plugins/vuetify.js

import Vue from 'vue'
import Vuetify from 'vuetify/lib'
import 'vuetify/src/stylus/app.styl'

Vue.use(Vuetify, {
    iconfont: 'md',
})

我做错了什么？

【问题讨论】：

标签： vue.js vuetify.js server-side-rendering

【解决方案1】：

我创建了一个 vue.config.js 文件，内容如下：

module.exports = {
    pluginOptions: {
        ssr: {
            nodeExternalsWhitelist: [/^vuetify/]
        }
    }
}

对我有帮助。

【讨论】：