SolidJSS
SolidJS•3y ago•
7 replies
Torx

Bundling Component SSR Compatible library - sharedConfig is undefined

Hello,

I'm trying to create a SolidJS Component library which will be imported into an Astro project. Most of the components will be hydrated, which means they will be rendered in the server. I used the ssr:true option of vite solidPlugin, but I'm facing an issue,

This is my vitejs config : 

const path = require('path')
const { defineConfig } = require('vite')
import dts from 'vite-plugin-dts'
import solidPlugin from 'vite-plugin-solid'

module.exports = defineConfig({
  build: {
    target: "esnext",
    lib: {
      entry: path.resolve(__dirname, 'src/index.ts'),
      name: 'lib',
      fileName: (format) => `lib.${format}.js`,
      formats: ["es", "umd"],
    },
    rollupOptions: {
      external: [
        'solid-js', 'a', 'b'
      ]
    }
  },
  plugins: [
    dts({
      insertTypesEntry: true,
      exclude: ["node_modules/**"]
    }),
    solidPlugin({
      ssr: true
    })
  ],
})


When I try then to import my library to an Astro project, it tells me the following when I try to render one of the component : 

if (!__vite_ssr_import_0__.sharedConfig.context || !(t = __vite_ssr_import_0__.sharedConfig.registry.get(n = et()))) {
TypeError: Cannot read properties of undefined (reading 'get')


This is the generated code : 
import { sharedConfig as x, ... } from "solid-js";

// ...
function A(e) {
  let t, n;
  if (!x.context || !(t = x.registry.get(n = et()))) {
    if (x.context && console.warn("Unable to find DOM nodes for hydration key:", n), !e)
      throw new Error("Unrecoverable Hydration Mismatch. No template for key: " + n);
    return e();
  }
  return x.completed && x.completed.add(t), x.registry.delete(n), t;
}


Does anyone know what am I missing here ?
Was this page helpful?