Recientemente cambié al nuevo compilador Vite para Laravel. Noté que de alguna manera ya no aceptaba mi objeto de ventana. No hay problema, pensé, solo usaré importaciones/exportaciones. Sin embargo, sigo recibiendo el mismo error:
The requested module '../../../../../js/plugins/pageflip.js' does not provide an export named 'pageFlip'He buscado en Internet, pero sigue diciéndome que no confunda las exportaciones/importaciones nombradas con las predeterminadas. Sin embargo, no veo nada malo con mi código. ¿Podría alguien ayudarme con esto, por favor?
mostrar.blade.php
<div> HTML HERE </div> @push('scripts') <script type="module"> import {pageFlip} from "../../../../../js/plugins/pageflip.js"; @isset(condition here) pageFlip.turnToPage({{ $tale->taleUser->progress }}) @endisset @can(condition here) pageFlip.on('flip', (e) => { document.getElementById('pageProgress').value = pageFlip.getCurrentPageIndex(); document.getElementById('pageCount').innerHTML = pageFlip.getCurrentPageIndex(); }); @endcan function turnPage(bool) { if (bool) { return pageFlip.turnToNextPage(); } return pageFlip.turnToPrevPage(); } </script> @endpushMi archivo de script:
import {PageFlip} from 'page-flip' const pageFlip = new PageFlip(document.getElementById('book'), { width: 400, height: 600, size: ('stretch'), minWidth: 200, minHeight: 400, maxWidth: 1000, maxHeight: 1000, autoSize: true, disableFlipByClick: true, showCover: false } ); pageFlip.loadFromHTML(document.querySelectorAll('.tale-page')); export { pageFlip }El archivo de configuración vite:
import { defineConfig } from 'vite'; import laravel from 'laravel-vite-plugin'; export default defineConfig({ plugins: [ laravel([ 'resources/css/app.css', 'resources/js/app.js', 'resources/js/plugins/pageflip.js', ]), ], });A juzgar por el error, estoy un poco confundido. Realmente estoy proporcionando una exportación llamada 'pageFlip', ¿verdad? ¿O posiblemente me estoy perdiendo alguna configuración vite?
Estoy usando el paquete StPageFlip proporcionado por Nodlik.
p debe ser mayúscula en PageFlip en el archivo show.blade.php . Así que reemplace import {pageFlip} from "../../../../../js/plugins/pageflip.js"; con import {PageFlip} from "../../../../../js/plugins/pageflip.js";