Quiero usar https://github.com/ueberdosis/tiptap en mi aplicación Laravel.
Hice una npm install @tiptap/core @tiptap/starter-kit y los módulos están bien instalados y visibles en mi carpeta node_modules . Luego, agregué
import { Editor } from '@tiptap/core' import StarterKit from '@tiptap/starter-kit' a mis resources/js/apps.js y ejecuté un npm run dev . Puedo ver un código tiptap en mi archivo public/js/app.js .
Me gustaría crear una instancia de una clase tiptap de otro archivo JS público:
<script type="module" src="{{ asset('js/tiptap.js') }}"></script> en mi archivo Blade import { Editor } from '@tiptap/core' import StarterKit from '@tiptap/starter-kit' new Editor({ element: document.querySelector('.element'), extensions: [ StarterKit, ], content: '<p>Hello World!</p>', }) pero acabo de obtener un Uncaught TypeError: Failed to resolve module specifier "@tiptap/core". Relative references must start with either "/", "./", or "../". en la consola
Así que sí, lo más probable es que haya una ruta incorrecta para la importación. Traté de cambiarlo a './app.js@tiptap/core' y otras variaciones, pero siempre termino con un 404 Not found .
Siento que tal vez lo estoy haciendo de la manera incorrecta, tal vez, no lo sé. ¿Tendrían algún consejo sobre cómo hacer eso?
No puede acceder a un paquete desde el exterior porque cuando webpack lo creó para usted, encapsula el archivo como un bundle , por lo que para poder acceder a él, puede crear otro archivo js en los resources/js luego incluirlo dentro de la app.js para ser incluido con un paquete webpack como este
// hello.js console.log("welcome from hello script") // app.js require('./hello.js')