Description
When I set
pluginOptions: {
ssr: {
criticalCSS: false
, build and run yarn ssr:build && yarn ssr:start
, and then directly try to open up an existing subroute like localhost:8000/something
, this fails with
(node:184939) UnhandledPromiseRejectionWarning: ReferenceError: document is not defined
at js/app.e426663d.js:54:37
at new Promise (<anonymous>:null:null)
at Function.requireEnsure [as e] (webpack/bootstrap:49:0)
at component (src/vue-router.coffee:17:17)
at /b/ls/repo/web/node_modules/vue-router/dist/vue-router.common.js:1943:17
... etc ...
at router.beforeEach (src/vue-router.coffee:47:3)
at iterator (/b/ls/repo/web/node_modules/vue-router/dist/vue-router.common.js:2160:7)
... etc ...
at new Promise (<anonymous>:null:null)
at VueRouter.push (/b/ls/repo/web/node_modules/vue-router/dist/vue-router.common.js:2816:12)
at Promise (src/entry-server.coffee:14:9)
My guess is, this line
vue-cli-plugin-ssr/lib/webpack.js
Line 27 in e9d0c4f
vue-cli-plugin-ssr/lib/webpack.js
Line 34 in e9d0c4f
vue-cli-plugin-ssr/lib/webpack.js
Line 36 in e9d0c4f
criticalCSS
is active.Is this true? If so, I can create a pull request.
Edit: For the meantime, I fixed it here
As an alternative, maybe switch to https://github.com/faceyspacey/extract-css-chunks-webpack-plugin? But this probably needs more adjustments, as simply replacing MiniCSS with this one did not solve the issue for me.
Edit: For debugging purposes, I extracted the errorneous chunk from the vue-ssr-server-bundle.json:
module.exports =
/******/ (function(modules) { // webpackBootstrap
// [...]
/******/ // This file contains only the entry chunk.
/******/ // The chunk loading function for additional chunks
/******/ __webpack_require__.e = function requireEnsure(chunkId) {
/******/ var promises = [];
/******/ // extract-css-chunks-webpack-plugin CSS loading
/******/ var cssChunks = {"chunk-1163a9d5":1,"chunk-7ef57ddd":1};
/******/ if(installedCssChunks[chunkId]) promises.push(installedCssChunks[chunkId]);
/******/ else if(installedCssChunks[chunkId] !== 0 && cssChunks[chunkId]) {
/******/ promises.push(installedCssChunks[chunkId] = new Promise(function(resolve, reject) {
/******/ var href = "css/" + ({}[chunkId]||chunkId) + "." + {"chunk-1163a9d5":"5bffa29a","chunk-2d21e30b":"31d6cfe0","chunk-2d231056":"31d6cfe0","chunk-7ef57ddd":"939d4d1e"}[chunkId] + ".chunk.css";
/******/ var fullhref = __webpack_require__.p + href;
/******/ var existingLinkTags = document.getElementsByTagName("link");
It fails in the last line.