fix: rollup, reading undefined

Author: zernonia

.gitignore

@@ -3,4 +3,5 @@ node_modules
 dist
 dist-ssr
 *.local
-.nuxt
+.nuxt
+.output

demo/app.vue

@@ -1,21 +1,22 @@
 <script setup lang="ts">
-import { NotionRenderer, getPageBlocks } from "vue3-notion"
+import { getPageBlocks } from "vue3-notion"
 import { onMounted, ref } from "vue"
 import { useNuxtApp } from "#app"
-const blockMap = ref()
+import "../src/style.css"
+
+const nuxtApp = useNuxtApp()
+const { data } = await useAsyncData("count", () => getPageBlocks("2e22de6b770e4166be301490f6ffd420"))
 
 onMounted(async () => {
   // react-notion tester: 2e22de6b770e4166be301490f6ffd420
   // equation tester: 2a1d5226d68246deba627012081693f9
   // table tester: bd1de400a8b349dc824f4f00e61d0797
   // todo tester: 235057194b954a60ace89c052a65d102
-  console.log(useNuxtApp())
-  blockMap.value = await getPageBlocks("2e22de6b770e4166be301490f6ffd420")
 })
 </script>
 
 <template>
-  <div v-if="blockMap">
-    <NotionRenderer :blockMap="blockMap" fullPage prism katex todo />
+  <div v-if="data">
+    <NotionRenderer :blockMap="data" fullPage prism katex todo />
   </div>
 </template>

demo/nuxt.config.ts

@@ -14,5 +14,5 @@ export default defineNuxtConfig({
   // build: {
   //   transpile: ["vue3-notion"],
   // },
-  buildModules: ["vue3-notion/nuxt"],
+  buildModules: ["../nuxt"],
 })

demo/package.json

@@ -10,6 +10,6 @@
   },
   "dependencies": {
     "nuxt3": "3.0.0-27274229.29599f0",
-    "vue3-notion": "^0.0.8"
+    "vue3-notion": "^0.0.9"
   }
 }

demo/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "extends": "./.nuxt/tsconfig.json",
+  "compilerOptions": {
+    "target": "esnext",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "strict": true,
+    "jsx": "preserve",
+    "sourceMap": true,
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "lib": ["esnext", "dom"],
+    "types": ["@nuxt/types"]
+  }
+}

demo/yarn.lock

@@ -5298,10 +5298,10 @@ vue-style-loader@^4.1.3:
     hash-sum "^1.0.2"
     loader-utils "^1.0.2"
 
-vue3-notion@^0.0.8:
-  version "0.0.8"
-  resolved "https://registry.yarnpkg.com/vue3-notion/-/vue3-notion-0.0.%3Cspan%20class="x x-first x-last">8.tgz#3cfab03a40a00d799f57d74721c8b8db26c0a4e4"
-  integrity sha512-HH0JpvA1GeYAGIivmnid014Q2VkUOmsYACSi5qSl9lZNMDOS4psgE4IGdvGvcC/CKS/rMQE7/4aSpzng6991yQ==
+vue3-notion@^0.0.9:
+  version "0.0.9"
+  resolved "https://registry.yarnpkg.com/vue3-notion/-/vue3-notion-0.0.%3Cspan%20class="x x-first x-last">9.tgz#251db1ba123a86aab1f5870ab538bd889ae3ea51"
+  integrity sha512-zKnuTfVDteoVJ4ZPv9bILZI2CU28WjrlZSPKfsrvF2Kku4OgDryRRi217upJjan2Bcibb15ae5+HgEzOO3gzlA==
   dependencies:
     fragment-for-vue "^1.0.1"
     katex "^0.15.1"

nuxt/index.ts

@@ -8,7 +8,6 @@ export default defineNuxtModule({
   setup(options, nuxt) {
     const filename = fileURLToPath(import.meta.url)
     const __dirname = dirname(filename)
-    console.log(__dirname)
     addPluginTemplate({
       src: resolve(__dirname, "plugin.ts"),
       filename: "vue3-notion.ts",
@@ -22,5 +21,3 @@ export default defineNuxtModule({
     })
   },
 })
-
-module.exports.meta = require("../package.json")

nuxt/plugin.ts

@@ -1,6 +1,5 @@
 import VueNotion from "vue3-notion"
 import { getPageBlocks, getPageTable } from "vue3-notion"
-import "vue3-notion/dist/style.css"
 
 export default (nuxtApp) => {
   const notion = { getPageBlocks, getPageTable }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue3-notion",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "description": "Vue 3 Unofficial Notion Renderer",
   "repository": "github:zernonia/vue3-notion",
   "main": "dist/library.ts",
@@ -28,7 +28,6 @@
     "fragment-for-vue": "^1.0.1",
     "katex": "^0.15.1",
     "prismjs": "^1.25.0",
-    "unbuild": "^0.6.7",
     "vue": "^3.2.26"
   },
   "devDependencies": {
@@ -51,6 +50,9 @@
     "vue-tsc": "^0.29.8"
   },
   "peerDependencies": {
-    "vue": "^3.2.20"
+    "vue": "^3.2.20",
+    "fragment-for-vue": "^1.0.1",
+    "katex": "^0.15.1",
+    "prismjs": "^1.25.0"
   }
 }

rollup.config.ts

@@ -22,6 +22,7 @@ const plugins = [
   replace({
     "process.env.NODE_ENV": JSON.stringify("production"),
     "process.env.ES_BUILD": JSON.stringify("false"),
+    preventAssignment: true,
   }),
   alias({
     entries: {
@@ -40,6 +41,7 @@ export default [
         format: "esm",
         name: "Vue3Notion",
         file: "dist/library.ts",
+        exports: "named",
       },
     ],
     external,
@@ -53,6 +55,7 @@ export default [
         format: "cjs",
         name: "Vue3Notion",
         file: "dist/library.ssr.ts",
+        exports: "named",
         globals,
       },
     ],
@@ -67,6 +70,7 @@ export default [
       format: "iife",
       name: "Vue3Notion",
       file: "dist/min.js",
+      exports: "named",
       globals,
     },
     plugins: [vue(), ...plugins],

src/blocks/code.vue

@@ -17,7 +17,7 @@ const langClass = computed(() => {
 })
 
 const supported = computed(() => {
-  return Prism.languages[lang.value]
+  return Prism?.languages[lang.value]
 })
 </script>
 

src/blocks/helpers/prism.vue

@@ -18,7 +18,7 @@ const props = defineProps({
 })
 
 const { code, inline, language } = toRefs(props)
-const prismLanguage = Prism.languages[language.value]
+const prismLanguage = computed(() => Prism?.languages[language.value])
 const className = computed(() => `language-${language.value}`)
 
 const d = computed(() => Prism.highlight(code?.value, prismLanguage, "en"))