Anonymous
Файлы Vite .js не загружаются из папки public/build! Но загрузка напрямую из папки ресурсов
Сообщение
Anonymous » 16 сен 2024, 23:52
Laravel 10,
laravel-vite-plugin - ^1.0.5,
vite - ^5.4.5
Ниже приведен мой файл config.js
Код: Выделить всё
import { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
import path from "path";
export default defineConfig({
build: {
outDir: "public/build",
emptyOutDir: false,
assetsDir: "static",
sourcemap: true,
rollupOptions: {
input: {
"js/app": path.resolve(__dirname, "resources/js/app.js"),
"js/bootstrap": path.resolve(
__dirname,
"resources/js/bootstrap.js"
),
"js/vendor": path.resolve(__dirname, "resources/js/vendor.js"),
"js/sockets/bootstrap": path.resolve(
__dirname,
"resources/js/sockets/bootstrap.js"
),
"js/layouts/smart": path.resolve(
__dirname,
"resources/js/layouts/smart.js"
),
"js/libraries/cs": path.resolve(
__dirname,
"resources/js/libraries/cs.js"
),
"js/libraries/skin": path.resolve(
__dirname,
"resources/js/libraries/skin.js"
),
"js/libraries/vertex": path.resolve(
__dirname,
"resources/js/libraries/vertex.js"
),
"js/libraries/widget": path.resolve(
__dirname,
"resources/js/libraries/widget.js"
),
"js/app/layouts/bxslider": path.resolve(
__dirname,
"resources/js/app/layouts/bxslider.js"
),
"js/app/layouts/page": path.resolve(
__dirname,
"resources/js/app/layouts/page.js"
),
"js/app/layouts/portal": path.resolve(
__dirname,
"resources/js/app/layouts/portal.js"
),
"js/app/modules/admin/managing/listing/index": path.resolve(
__dirname,
"resources/js/app/modules/admin/managing/listing/index.js"
),
"js/app/modules/admin/member/member/index": path.resolve(
__dirname,
"resources/js/app/modules/admin/member/index.js"
),
"js/app/modules/admin/member/member/form": path.resolve(
__dirname,
"resources/js/app/modules/admin/member/form.js"
),
"js/config/core/dev/app": path.resolve(
__dirname,
"resources/js/config/core/dev/app.js"
),
"css/app": path.resolve(__dirname, "resources/css/app.css"),
"css/vendor": path.resolve(
__dirname,
"resources/css/vendor.css"
),
"css/app/layouts/cms": path.resolve(
__dirname,
"resources/css/app/layouts/cms.css"
),
"css/app/layouts/auth": path.resolve(
__dirname,
"resources/css/app/layouts/auth.css"
),
"css/app/layouts/page": path.resolve(
__dirname,
"resources/css/app/layouts/page.css"
),
"css/app/layouts/admin": path.resolve(
__dirname,
"resources/css/app/layouts/admin.css"
),
"css/app/layouts/portal": path.resolve(
__dirname,
"resources/css/app/layouts/portal.css"
),
},
output: {
entryFileNames: (chunkInfo) => {
if (chunkInfo.name.startsWith("js/")) {
return `${chunkInfo.name}.[hash].js`;
}
if (chunkInfo.name.startsWith("css/")) {
return `${chunkInfo.name}.css`;
}
//return `${chunkInfo.name}.[hash].js`;
},
chunkFileNames: (chunkInfo) => {
if (chunkInfo.name.startsWith("js/")) {
return `${chunkInfo.name}.[hash].js`;
}
if (chunkInfo.name.startsWith("css/")) {
return `${chunkInfo.name}.css`;
}
//return `${chunkInfo.name}.[hash].js`;
},
assetFileNames: (assetInfo) => {
if (assetInfo.name?.endsWith(".css")) {
return `[name].[hash][extname]`;
}
if (assetInfo.name?.endsWith(".js")) {
return `js/[name].[hash][extname]`;
}
if (
assetInfo.name.startsWith("fonts/") ||
assetInfo.name.startsWith("vendor/")
) {
return `[name][extname]`;
}
return `[name].[hash][extname]`;
},
},
},
},
plugins: [
laravel({
input: [
"resources/css/app.css",
"resources/css/vendor.css",
"resources/css/app/layouts/cms.css",
"resources/css/app/layouts/auth.css",
"resources/css/app/layouts/page.css",
"resources/css/app/layouts/admin.css",
"resources/css/app/layouts/portal.css",
"resources/js/app.js",
"resources/js/bootstrap.js",
"resources/js/vendor.js",
"resources/js/sockets/bootstrap.js",
"resources/js/layouts/smart.js",
"resources/js/libraries/cs.js",
"resources/js/libraries/skin.js",
"resources/js/libraries/vertex.js",
"resources/js/libraries/widget.js",
"resources/js/app/layouts/bxslider.js",
"resources/js/app/layouts/page.js",
"resources/js/app/layouts/portal.js",
"resources/js/app/modules/admin/managing/listing/index.js",
"resources/js/app/modules/admin/member/member/index.js",
"resources/js/app/modules/admin/member/member/form.js",
"resources/js/config/core/dev/app.js",
],
refresh: true,
esm: true,
}),
],
});
Это моя сборка файла манифеста.json после запуска сборки npm prod.
Код: Выделить всё
{
"resources/css/app.css": {
"file": "css/app.CNk80R6N.css",
"src": "resources/css/app.css",
"isEntry": true
},
"resources/css/app/layouts/admin.css": {
"file": "css/app/layouts/admin.qSM2Dncf.css",
"src": "resources/css/app/layouts/admin.css",
"isEntry": true
},
"resources/css/app/layouts/auth.css": {
"file": "css/app/layouts/auth.CgXVspRn.css",
"src": "resources/css/app/layouts/auth.css",
"isEntry": true
},
"resources/css/app/layouts/cms.css": {
"file": "css/app/layouts/cms.DqOcUH1V.css",
"src": "resources/css/app/layouts/cms.css",
"isEntry": true
},
"resources/css/app/layouts/page.css": {
"file": "css/app/layouts/page.EEtcLhQm.css",
"src": "resources/css/app/layouts/page.css",
"isEntry": true
},
"resources/css/app/layouts/portal.css": {
"file": "css/app/layouts/portal.Dc-ro14i.css",
"src": "resources/css/app/layouts/portal.css",
"isEntry": true
},
"resources/css/vendor.css": {
"file": "css/vendor.C5ruzaah.css",
"src": "resources/css/vendor.css",
"isEntry": true
},
"resources/js/app.js": {
"file": "js/app.CnL08CsG.js",
"name": "js/app",
"src": "resources/js/app.js",
"isEntry": true
},
"resources/js/app/layouts/bxslider.js": {
"file": "js/app/layouts/bxslider.DzL8e1Hr.js",
"name": "js/app/layouts/bxslider",
"src": "resources/js/app/layouts/bxslider.js",
"isEntry": true
},
"resources/js/app/layouts/page.js": {
"file": "js/app/layouts/page.DrJWWN61.js",
"name": "js/app/layouts/page",
"src": "resources/js/app/layouts/page.js",
"isEntry": true
},
"resources/js/app/layouts/portal.js": {
"file": "js/app/layouts/portal.CW5bVUqY.js",
"name": "js/app/layouts/portal",
"src": "resources/js/app/layouts/portal.js",
"isEntry": true
},
"resources/js/app/modules/admin/managing/listing/index.js": {
"file": "js/app/modules/admin/managing/listing/index.BcXq96BO.js",
"name": "js/app/modules/admin/managing/listing/index",
"src": "resources/js/app/modules/admin/managing/listing/index.js",
"isEntry": true
},
"resources/js/app/modules/admin/member/form.js": {
"file": "js/app/modules/admin/member/member/form.CwcMkPk1.js",
"name": "js/app/modules/admin/member/member/form",
"src": "resources/js/app/modules/admin/member/form.js",
"isEntry": true
},
"resources/js/app/modules/admin/member/index.js": {
"file": "js/app/modules/admin/member/member/index.mt8nT3RK.js",
"name": "js/app/modules/admin/member/member/index",
"src": "resources/js/app/modules/admin/member/index.js",
"isEntry": true
},
"resources/js/bootstrap.js": {
"file": "js/bootstrap.CEsE5a7F.js",
"name": "js/bootstrap",
"src": "resources/js/bootstrap.js",
"isEntry": true
},
"resources/js/config/core/dev/app.js": {
"file": "js/config/core/dev/app.l0sNRNKZ.js",
"name": "js/config/core/dev/app",
"src": "resources/js/config/core/dev/app.js",
"isEntry": true
},
"resources/js/layouts/smart.js": {
"file": "js/layouts/smart.BtPzgjTD.js",
"name": "js/layouts/smart",
"src": "resources/js/layouts/smart.js",
"isEntry": true
},
"resources/js/libraries/cs.js": {
"file": "js/libraries/cs.l0sNRNKZ.js",
"name": "js/libraries/cs",
"src": "resources/js/libraries/cs.js",
"isEntry": true
},
"resources/js/libraries/skin.js": {
"file": "js/libraries/skin.l0sNRNKZ.js",
"name": "js/libraries/skin",
"src": "resources/js/libraries/skin.js",
"isEntry": true
},
"resources/js/libraries/vertex.js": {
"file": "js/libraries/vertex.l0sNRNKZ.js",
"name": "js/libraries/vertex",
"src": "resources/js/libraries/vertex.js",
"isEntry": true
},
"resources/js/libraries/widget.js": {
"file": "js/libraries/widget.BzK2CPaz.js",
"name": "js/libraries/widget",
"src": "resources/js/libraries/widget.js",
"isEntry": true
},
"resources/js/sockets/bootstrap.js": {
"file": "js/sockets/bootstrap.ZJELHheL.js",
"name": "js/sockets/bootstrap",
"src": "resources/js/sockets/bootstrap.js",
"isEntry": true
},
"resources/js/vendor.js": {
"file": "js/vendor.COF9nXa8.js",
"name": "js/vendor",
"src": "resources/js/vendor.js",
"isEntry": true
}
}
Я загружаю файлы CSS и js, как показано ниже,
Код: Выделить всё
@section('scripts')
@parent
@vite('resources/js/app/modules/admin/managing/listing/index.js')
@endsection
@section('styles')
@include('templates.layouts.style')
@vite('resources/css/app.css')
@vite('resources/css/app/layouts/portal.css')
@vite('resources/css/app/layouts/admin.css')
@show
В настоящее время файлы CSS загружаются правильно из папки public/build, а файлы JS загружаются напрямую из папки ресурсов. Как я могу это исправить? Я впервые использую Vite в laravel, поэтому понятия не имею об этой проблеме.
Подробнее здесь:
https://stackoverflow.com/questions/789 ... tly-from-r
1726519933
Anonymous
[b]Laravel 10, laravel-vite-plugin - ^1.0.5, vite - ^5.4.5[/b] Ниже приведен мой файл config.js [code]import { defineConfig } from "vite"; import laravel from "laravel-vite-plugin"; import path from "path"; export default defineConfig({ build: { outDir: "public/build", emptyOutDir: false, assetsDir: "static", sourcemap: true, rollupOptions: { input: { "js/app": path.resolve(__dirname, "resources/js/app.js"), "js/bootstrap": path.resolve( __dirname, "resources/js/bootstrap.js" ), "js/vendor": path.resolve(__dirname, "resources/js/vendor.js"), "js/sockets/bootstrap": path.resolve( __dirname, "resources/js/sockets/bootstrap.js" ), "js/layouts/smart": path.resolve( __dirname, "resources/js/layouts/smart.js" ), "js/libraries/cs": path.resolve( __dirname, "resources/js/libraries/cs.js" ), "js/libraries/skin": path.resolve( __dirname, "resources/js/libraries/skin.js" ), "js/libraries/vertex": path.resolve( __dirname, "resources/js/libraries/vertex.js" ), "js/libraries/widget": path.resolve( __dirname, "resources/js/libraries/widget.js" ), "js/app/layouts/bxslider": path.resolve( __dirname, "resources/js/app/layouts/bxslider.js" ), "js/app/layouts/page": path.resolve( __dirname, "resources/js/app/layouts/page.js" ), "js/app/layouts/portal": path.resolve( __dirname, "resources/js/app/layouts/portal.js" ), "js/app/modules/admin/managing/listing/index": path.resolve( __dirname, "resources/js/app/modules/admin/managing/listing/index.js" ), "js/app/modules/admin/member/member/index": path.resolve( __dirname, "resources/js/app/modules/admin/member/index.js" ), "js/app/modules/admin/member/member/form": path.resolve( __dirname, "resources/js/app/modules/admin/member/form.js" ), "js/config/core/dev/app": path.resolve( __dirname, "resources/js/config/core/dev/app.js" ), "css/app": path.resolve(__dirname, "resources/css/app.css"), "css/vendor": path.resolve( __dirname, "resources/css/vendor.css" ), "css/app/layouts/cms": path.resolve( __dirname, "resources/css/app/layouts/cms.css" ), "css/app/layouts/auth": path.resolve( __dirname, "resources/css/app/layouts/auth.css" ), "css/app/layouts/page": path.resolve( __dirname, "resources/css/app/layouts/page.css" ), "css/app/layouts/admin": path.resolve( __dirname, "resources/css/app/layouts/admin.css" ), "css/app/layouts/portal": path.resolve( __dirname, "resources/css/app/layouts/portal.css" ), }, output: { entryFileNames: (chunkInfo) => { if (chunkInfo.name.startsWith("js/")) { return `${chunkInfo.name}.[hash].js`; } if (chunkInfo.name.startsWith("css/")) { return `${chunkInfo.name}.css`; } //return `${chunkInfo.name}.[hash].js`; }, chunkFileNames: (chunkInfo) => { if (chunkInfo.name.startsWith("js/")) { return `${chunkInfo.name}.[hash].js`; } if (chunkInfo.name.startsWith("css/")) { return `${chunkInfo.name}.css`; } //return `${chunkInfo.name}.[hash].js`; }, assetFileNames: (assetInfo) => { if (assetInfo.name?.endsWith(".css")) { return `[name].[hash][extname]`; } if (assetInfo.name?.endsWith(".js")) { return `js/[name].[hash][extname]`; } if ( assetInfo.name.startsWith("fonts/") || assetInfo.name.startsWith("vendor/") ) { return `[name][extname]`; } return `[name].[hash][extname]`; }, }, }, }, plugins: [ laravel({ input: [ "resources/css/app.css", "resources/css/vendor.css", "resources/css/app/layouts/cms.css", "resources/css/app/layouts/auth.css", "resources/css/app/layouts/page.css", "resources/css/app/layouts/admin.css", "resources/css/app/layouts/portal.css", "resources/js/app.js", "resources/js/bootstrap.js", "resources/js/vendor.js", "resources/js/sockets/bootstrap.js", "resources/js/layouts/smart.js", "resources/js/libraries/cs.js", "resources/js/libraries/skin.js", "resources/js/libraries/vertex.js", "resources/js/libraries/widget.js", "resources/js/app/layouts/bxslider.js", "resources/js/app/layouts/page.js", "resources/js/app/layouts/portal.js", "resources/js/app/modules/admin/managing/listing/index.js", "resources/js/app/modules/admin/member/member/index.js", "resources/js/app/modules/admin/member/member/form.js", "resources/js/config/core/dev/app.js", ], refresh: true, esm: true, }), ], }); [/code] Это моя сборка файла манифеста.json после запуска сборки npm prod. [code]{ "resources/css/app.css": { "file": "css/app.CNk80R6N.css", "src": "resources/css/app.css", "isEntry": true }, "resources/css/app/layouts/admin.css": { "file": "css/app/layouts/admin.qSM2Dncf.css", "src": "resources/css/app/layouts/admin.css", "isEntry": true }, "resources/css/app/layouts/auth.css": { "file": "css/app/layouts/auth.CgXVspRn.css", "src": "resources/css/app/layouts/auth.css", "isEntry": true }, "resources/css/app/layouts/cms.css": { "file": "css/app/layouts/cms.DqOcUH1V.css", "src": "resources/css/app/layouts/cms.css", "isEntry": true }, "resources/css/app/layouts/page.css": { "file": "css/app/layouts/page.EEtcLhQm.css", "src": "resources/css/app/layouts/page.css", "isEntry": true }, "resources/css/app/layouts/portal.css": { "file": "css/app/layouts/portal.Dc-ro14i.css", "src": "resources/css/app/layouts/portal.css", "isEntry": true }, "resources/css/vendor.css": { "file": "css/vendor.C5ruzaah.css", "src": "resources/css/vendor.css", "isEntry": true }, "resources/js/app.js": { "file": "js/app.CnL08CsG.js", "name": "js/app", "src": "resources/js/app.js", "isEntry": true }, "resources/js/app/layouts/bxslider.js": { "file": "js/app/layouts/bxslider.DzL8e1Hr.js", "name": "js/app/layouts/bxslider", "src": "resources/js/app/layouts/bxslider.js", "isEntry": true }, "resources/js/app/layouts/page.js": { "file": "js/app/layouts/page.DrJWWN61.js", "name": "js/app/layouts/page", "src": "resources/js/app/layouts/page.js", "isEntry": true }, "resources/js/app/layouts/portal.js": { "file": "js/app/layouts/portal.CW5bVUqY.js", "name": "js/app/layouts/portal", "src": "resources/js/app/layouts/portal.js", "isEntry": true }, "resources/js/app/modules/admin/managing/listing/index.js": { "file": "js/app/modules/admin/managing/listing/index.BcXq96BO.js", "name": "js/app/modules/admin/managing/listing/index", "src": "resources/js/app/modules/admin/managing/listing/index.js", "isEntry": true }, "resources/js/app/modules/admin/member/form.js": { "file": "js/app/modules/admin/member/member/form.CwcMkPk1.js", "name": "js/app/modules/admin/member/member/form", "src": "resources/js/app/modules/admin/member/form.js", "isEntry": true }, "resources/js/app/modules/admin/member/index.js": { "file": "js/app/modules/admin/member/member/index.mt8nT3RK.js", "name": "js/app/modules/admin/member/member/index", "src": "resources/js/app/modules/admin/member/index.js", "isEntry": true }, "resources/js/bootstrap.js": { "file": "js/bootstrap.CEsE5a7F.js", "name": "js/bootstrap", "src": "resources/js/bootstrap.js", "isEntry": true }, "resources/js/config/core/dev/app.js": { "file": "js/config/core/dev/app.l0sNRNKZ.js", "name": "js/config/core/dev/app", "src": "resources/js/config/core/dev/app.js", "isEntry": true }, "resources/js/layouts/smart.js": { "file": "js/layouts/smart.BtPzgjTD.js", "name": "js/layouts/smart", "src": "resources/js/layouts/smart.js", "isEntry": true }, "resources/js/libraries/cs.js": { "file": "js/libraries/cs.l0sNRNKZ.js", "name": "js/libraries/cs", "src": "resources/js/libraries/cs.js", "isEntry": true }, "resources/js/libraries/skin.js": { "file": "js/libraries/skin.l0sNRNKZ.js", "name": "js/libraries/skin", "src": "resources/js/libraries/skin.js", "isEntry": true }, "resources/js/libraries/vertex.js": { "file": "js/libraries/vertex.l0sNRNKZ.js", "name": "js/libraries/vertex", "src": "resources/js/libraries/vertex.js", "isEntry": true }, "resources/js/libraries/widget.js": { "file": "js/libraries/widget.BzK2CPaz.js", "name": "js/libraries/widget", "src": "resources/js/libraries/widget.js", "isEntry": true }, "resources/js/sockets/bootstrap.js": { "file": "js/sockets/bootstrap.ZJELHheL.js", "name": "js/sockets/bootstrap", "src": "resources/js/sockets/bootstrap.js", "isEntry": true }, "resources/js/vendor.js": { "file": "js/vendor.COF9nXa8.js", "name": "js/vendor", "src": "resources/js/vendor.js", "isEntry": true } } [/code] Я загружаю файлы CSS и js, как показано ниже, [code]@section('scripts') @parent @vite('resources/js/app/modules/admin/managing/listing/index.js') @endsection @section('styles') @include('templates.layouts.style') @vite('resources/css/app.css') @vite('resources/css/app/layouts/portal.css') @vite('resources/css/app/layouts/admin.css') @show [/code] В настоящее время файлы CSS загружаются правильно из папки public/build, а файлы JS загружаются напрямую из папки ресурсов. Как я могу это исправить? Я впервые использую Vite в laravel, поэтому понятия не имею об этой проблеме. Подробнее здесь: [url]https://stackoverflow.com/questions/78991761/vite-js-files-not-loading-from-public-build-folder-but-loading-directly-from-r[/url]