Vue + Vuetify-рендеринг на стороне сервера: CSS вызвал `ReferenceError: документ не определен` в производственной сборке - PullRequest
Новая
       14

Vue + Vuetify-рендеринг на стороне сервера: CSS вызвал `ReferenceError: документ не определен` в производственной сборке

1 голос
/ 28 сентября 2019

Short

Происходит только в производственной сборке (SSR).Работа в режиме разработки. 

err: ReferenceError: document is not defined
at js/index.f9ac44f3.js:1:1647
at new Promise (<anonymous>)
at Function.i.e (webpack/bootstrap:50:27)
at i (webpack:/src/views lazy ^\.\/.*\.vue$ namespace object:74:0)
at js/index.f9ac44f3.js:8:7266
at .../node_modules/vue-router/dist/vue-router.common.js:1768:17                       
at .../node_modules/vue-router/dist/vue-router.common.js:1795:66
at Array.map (<anonymous>)
at .../node_modules/vue-router/dist/vue-router.common.js:1795:38
at Array.map (<anonymous>)
at flatMapComponents (.../node_modules/vue-router/dist/vue-router.common.js:1794:26)

Long

Я настроил SSR для приложения Vue (vue-cli).Он работает в режиме разработки для меня.Мои команды для генерации vue-ssr-client-manifest.json и vue-ssr-server-bundle.json: 

"dev-client": "vue-cli-service serve --ssr --client --no-clean",
"dev-server": "vue-cli-service build --watch --mode development --ssr --no-clean",

--ssr и --client - это мои флаги, которые изменяют некоторые настройки для SSR.На этом этапе (dev-mode) я вставляю весь CSS в HTML. 

<head>
  <style>
    ALL 300 KB of CSS HERE
  </style>
</head>

Я надеялся, что когда я переключусь в режим production, весь этот CSS станет отдельным файлом со ссылкой на него.,Команды, используемые для производства: 

"ssr:client": "vue-cli-service build --ssr --client",
"ssr:server": "vue-cli-service build --ssr --no-clean",

Я не написал никаких изменений для сборок dev / prod в моем vue.config.js.Единственное изменение - теперь это --mode production.

Я нашел такие строки в сгенерированном файле: 

a=document.getElementsByTagName(\"link\"),c=0;
var f=document.getElementsByTagName(\"style\");
var h=document.getElementsByTagName(\"head\")[0];

Что отвечает за написание этих строк?Что нужно сделать, чтобы удалить их в производственной сборке?

Связано

Сборка SSR говорит «документ не определен» для приложения SPA Vuejs cli3, использующего Vueбиблиотека cli3

...