contents-popup-redtombo 1.0.2 → 1.0.4

package/components/componentPopup.vue

@@ -24,6 +24,7 @@ watch(
   component, // 監視対象としてリアクティブな `component` を指定
   (newComponent: string) => {
     changePopup(newComponent); // ポップアップを変更する
+    console.log("test");
   }
 );
 

package/module.ts

@@ -0,0 +1,14 @@
+import { defineNuxtModule } from '@nuxt/kit'
+import { resolve } from 'path'
+
+export default defineNuxtModule({
+  setup(_, nuxt) {
+    // コンポーネントディレクトリを追加
+    nuxt.hook('components:dirs', (dirs) => {
+      dirs.push({
+        path: resolve(__dirname, 'components'), // モジュール内のコンポーネントを登録
+        pathPrefix: false,
+      })
+    })
+  },
+})

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "contents-popup-redtombo",
- "version": "1.0.2",
- "description": "中のコンポーネントを変更できるポップアップ",
+ "version": "1.0.4",
+ "description": "中のComponentsを動的に切り替えれるポップアップ",
  "main": "./module.ts",
  "exports": {
    ".": "./module.ts"

package/components/DeleteSong.vue

@@ -1,3 +0,0 @@
-<template>
-  DeleteSong
-</template>

package/components/EditSong.vue

@@ -1,3 +0,0 @@
-<template>
-  EditSong
-</template>

package/composables/useComponent.ts

@@ -1,23 +0,0 @@
-interface State {
-  component: string; //コンポーネント
-}
-
-// グローバルな状態管理
-const state = reactive<State>({
-  component: "EditSong",
-});
-
-export function useComponent() {
-  function changeComponent(): void {
-    if (state.component === "EditSong") {
-      state.component = "DeleteSong";
-    } else {
-      state.component = "EditSong";
-    }
-  }
-
-  return {
-    changeComponent,
-    state,
-  };
-}