laravel 如何导入自己的js文件到vite？

xkrw2x1b 于 2022-12-14 发布在其他

关注(0)|答案(2)|浏览(161)

我使用Laravel与Vite，我想添加文件与Vanillia JS代码。之前我使用混合，我从来没有使用过Vite。我尝试添加此代码到文件vite.config.js像下面的例子：

laravel({
    input: [
        'resources/sass/app.scss',
        'resources/js/app.js',
        'resources/js/test.js', //this is my code
    ],
    refresh: true,
}),

但它不工作。我需要添加一个库和配置的代码。你能帮助我吗？

laravel

来源：https://stackoverflow.com/questions/73331352/how-import-own-js-file-into-vite

2条答案

按热度按时间

k3bvogb11#

使用@vite('resources/js/test.js')指令：https://legacy.laravel-vite.dev/guide/usage.html#vite

<head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
    
        <title>Laravel</title>
        @client
        @vite('main')
        @vite('resources/js/some-script.js')
        <!-- 
        In development:
            <script type="module" src="http://localhost:3000/@vite/client"></script>
            <script type="module" src="http://localhost:3000/resources/scripts/main.ts"></script>
            <script type="module" src="http://localhost:3000/resources/js/some-script.js"></script>
        In production:
            <script type="module" src="http://laravel.local/build/assets/main.66e83946.js"></script>
            <script type="module" src="http://laravel.local/build/assets/some-script.6d3515d2.js"></script>
        -->
    </head>

赞(0）回复(0）举报 2022-12-14

67up9zun2#

这适用于您自己创建的js文件和节点模块库js文件

您需要在vite.config.js和初始HTML文件（app.blade.php / welcome.blade.php）中声明它
在vite.config.js中

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
                'resources/js/test.js', //your custom js
                'node_modules/flowbite/dist/flowbite.js', //node modules js
                'node_modules/flowbite/dist/datepicker.js'
            ],
            refresh: true,
        }),
    ],
});

在HTML.blade.php中

<head>
     @vite(['resources/css/app.css', 'resources/js/app.js',         
     'resources/js/test.js',node_modules/flowbite/dist/flowbite.js' 
     ,'node_modules/flowbite/dist/datepicker.js'])

</head>

P.S：我在这里使用Flowbite插件作为示例 *

赞(0）回复(0）举报 2022-12-14

我来回答

laravel 如何导入自己的js文件到vite？

2条答案

相关问题

热门标签

最新问答