php 在Laravel项目中捆绑JavaScript资产时遇到问题

fjnneemd  于 2023-08-02  发布在  PHP
关注(0)|答案(1)|浏览(136)

问题是这样的:然而,我已经尝试了很多,我不能设置我的项目中的一些JS函数作为全局函数。
我得到了'resources\js”:
numerosALetras.js:

///////////////////////////

function unidades_nal(n){
...
}

function decenas_nal(n){
...
}

function centenas_nal(n){
...
}

/////////////////

function numerosAMeses(n){
...
}

function numeroADias(n){
...
}

export function numeroALetras(n){
...
}

function ucwords(str){
...
}

export function letrasANumero(str){
...
}

//export default {numeroALetras,letrasANumero};

字符串
app.js:

import './bootstrap';

import { numeroALetras, letrasANumero } from './numerosALetras';
//import * as numerosALetras from './numerosALetras';

window.numeroALetras = numeroALetras;
window.letrasANumero = letrasANumero;

import Alpine from 'alpinejs';
import focus from '@alpinejs/focus';
window.Alpine = Alpine;

Alpine.plugin(focus);

Alpine.start();


我的'vite.config.js'是:

import { defineConfig } from 'vite';
import laravel, { refreshPaths } from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
            ],
            refresh: [
                ...refreshPaths,
                'app/Http/Livewire/**',
            ],
        }),
    ],
});


然而,我在浏览器控制台上得到:
crear:1238 GET http://localhost/livewire/livewire. js?id=90730a3b0e7144480175 net::ERR_ABORTED 404(Not Found)
crear:587未捕获的引用错误:numeroALetras未在crear:587:3(匿名)@ crear:587定义
crear:1244未捕获的引用错误:在crear:1244:27未定义Livewire
下面是我的浏览器输出alert(numeroALetras(35));行:
x1c 0d1x的数据
我试过npm run buildnpm run dev,但都不起作用。
知道出了什么问题吗需要更多信息吗?
我没有包括我的JS函数的全部内容,因为它有很多代码,但如果需要,我可以分享它。
多谢了!莱昂德罗

mxg2im7a

mxg2im7a1#

我找到解决办法了
我正在将$(document).ready( ...);函数外的alert(numeroALetras(35));行编码到Blade视图的标记中。就是这样,在DOM完全加载之前。我现在把它放在里面,工作得很好。
所以,问题是,在我的应用程序中定义的“app.js”中的资产被正确加载之前,这个句子就被执行了。因此,当时没有定义numeroALetras函数,导致了"Uncaught TypeError: window.numeroALetras is not a function"错误。通过将alert(numeroALetras(35));移动到$(document).ready(...)函数中,我确保它只会在DOM完全加载之后执行,并且“app.js”中定义的所有资产都正确加载并可用。

相关问题