S
SolidJS•7d ago
Blankeos

In V8 Rust: `renderToString` always undefined `isServer` is false

In Rust V8, running renderToString gives me undefined. Interestingly isServer is always false. How do I tell solidjs to essentially run V8 like it's not in the browser. It seems to think it's in the browser or whatever. Is it the vite config?
1 Reply
Blankeos
BlankeosOP•6d ago
Ohh nvm figured it out.. I just realized I needed two separate vite configs for SSR and Client. on SSR: 
const polyfillPlugin = () => ({
  name: "v8-polyfill",
  generateBundle(options, bundle) {
    // 1. setTimeout - does not exist in V8 and solid-js on ssr.
    for (const fileName in bundle) {
      const chunk = bundle[fileName];
      if (chunk.type === "chunk" && chunk.isEntry) {
        chunk.code = `
if (typeof setTimeout === 'undefined') {
    globalThis.setTimeout = function(callback, delay) {
        if (typeof callback === 'function') {
            callback();
        }
        return 1;
    };
    globalThis.clearTimeout = function(id) {};
}

${chunk.code}`;
      }
    }
  },
});


// vite config: ...
plugins: [
    // ...
    solid({
      ssr: true,
      typescript: {
        onlyRemoveTypeImports: true,
      },
      solid: {
        hydratable: true,
      },
    }),
    polyfillPlugin()
]
const polyfillPlugin = () => ({
  name: "v8-polyfill",
  generateBundle(options, bundle) {
    // 1. setTimeout - does not exist in V8 and solid-js on ssr.
    for (const fileName in bundle) {
      const chunk = bundle[fileName];
      if (chunk.type === "chunk" && chunk.isEntry) {
        chunk.code = `
if (typeof setTimeout === 'undefined') {
    globalThis.setTimeout = function(callback, delay) {
        if (typeof callback === 'function') {
            callback();
        }
        return 1;
    };
    globalThis.clearTimeout = function(id) {};
}

${chunk.code}`;
      }
    }
  },
});


// vite config: ...
plugins: [
    // ...
    solid({
      ssr: true,
      typescript: {
        onlyRemoveTypeImports: true,
      },
      solid: {
        hydratable: true,
      },
    }),
    polyfillPlugin()
]
My thought process on figuring this out? (Mainly this in vike-solid) and solid-start --- On Client 
import { defineConfig } from "vite";
import solid from "vite-plugin-solid";

export default defineConfig({
  base: "/client/",
  plugins: [
    solid({
      solid: { hydratable: true }, // crucial
    }),
  ],
  build: {
    outDir: "dist/client",
    emptyOutDir: true,
    rollupOptions: {
      input: "./src/main.tsx",
      output: {
        format: "esm",
        entryFileNames: "[name].js",
        chunkFileNames: "[name]-[hash].js",
        assetFileNames: "assets/[name][extname]",
      },
    },
  },
});
import { defineConfig } from "vite";
import solid from "vite-plugin-solid";

export default defineConfig({
  base: "/client/",
  plugins: [
    solid({
      solid: { hydratable: true }, // crucial
    }),
  ],
  build: {
    outDir: "dist/client",
    emptyOutDir: true,
    rollupOptions: {
      input: "./src/main.tsx",
      output: {
        format: "esm",
        entryFileNames: "[name].js",
        chunkFileNames: "[name]-[hash].js",
        assetFileNames: "assets/[name][extname]",
      },
    },
  },
});

Did you find this page helpful?