search

inertiajs / inertia

Inertia.js lets you quickly build modern single-page React, Vue and Svelte apps using classic server-side routing and controllers.
https://inertiajs.com
MIT License
6.45k stars 431 forks source link

With the default `webpack.ssr.mix.js`, Inertia SSR node server fails when a `.vue` uses <style> section. #1077

Closed xieyuheng closed 2 years ago

xieyuheng commented 2 years ago

Example error messages:

ReferenceError: document is not defined
    at insertStyleElement (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:15999:15)
    at addStyle (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:16114:13)
    at modulesToDom (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:15987:18)
    at module.exports (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:16145:25)
    at Object../node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-8.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-8.use[2]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./resources/js/pages/home/HomePage.vue?vue&type=style&index=0&id=f08cac76&lang=css (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:15892:120)
    at __webpack_require__ (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:21900:41)
    at Object../resources/js/pages/home/HomePage.vue?vue&type=style&index=0&id=f08cac76&lang=css (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:21350:375)
    at __webpack_require__ (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:21900:41)
    at Object../resources/js/pages/home/HomePage.vue (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:18292:115)
    at __webpack_require__ (/home/xyh/readonlylink/readonlylink-next/public/js/server/ssr.js:21900:41)
xieyuheng commented 2 years ago

Should be a question for laravel-mix to disable css-loader for SSR build.

xieyuheng commented 2 years ago

Some notes, to help people who meet the same problem ~

We should ignore CSS during SSR build.

According to laravel-mix's source code: https://github.com/laravel-mix/laravel-mix/blob/master/src/components/Vue.js

There are two options: