Как собрать каждый файл js и css vite по определенному путиPhp

Кемеровские программисты php общаются здесь
Ответить
Anonymous
 Как собрать каждый файл js и css vite по определенному пути

Сообщение Anonymous »

Обновлено!!!
Я попробовал приведенный ниже код, и он поместил все мои файлы JS в правильную структуру папок, но, к сожалению, он не работает для файлов CSS. . Может ли кто-нибудь мне помочь?
Изображение

Код: Выделить всё

import { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
import path from "path";

export default defineConfig({
build: {
outDir: "public/build/assets",
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/all": path.resolve(
__dirname,
"resources/js/sockets/all.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": path.resolve(
__dirname,
"resources/js/app/modules/admin/managing/listing.js"
),
"js/app/modules/admin/member/member": path.resolve(
__dirname,
"resources/js/app/modules/admin/member/member.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}.js`; // Avoid adding 'js/' again
}
if (chunkInfo.name.startsWith("css/")) {
return `${chunkInfo.name}.css`;  // Avoid adding 'css/' again
}
return `${chunkInfo.name}.js`; // Default
},
chunkFileNames: (chunkInfo) => {
if (chunkInfo.name.startsWith("js/")) {
return `${chunkInfo.name}.js`; // Same logic for chunks
}
if (chunkInfo.name.startsWith("css/")) {
return `${chunkInfo.name}.css`;
}
return `${chunkInfo.name}.js`; // Default
},
assetFileNames: (assetInfo) => {
if (assetInfo.name?.endsWith(".css")) {
// Place general CSS files in the correct folder
if (assetInfo.name.includes("layouts")) {
return `css/app/layouts/[name].[hash][extname]`;
}
return `css/[name].[hash][extname]`;
}

if (assetInfo.name?.endsWith(".js")) {
return `js/[name].[hash][extname]`;
}
return `assets/[name].[hash][extname]`;
},
sourcemap: true,
},
},
},
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/all.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.js",
"resources/js/app/modules/admin/member/member.js",
"resources/js/config/core/dev/app.js",
],
refresh: true,
}),
],
});
Старый вопрос!!
Я хочу добиться того же способа, что и ниже, с помощью Vite,

Изображение

Ниже код, который я пробовал, но все файлы js и cs встроены в папку public/build/assets. Но мне нужно что-то вроде этого.
Например,
resources/css/ app.js необходимо хранить внутри public/build/assets/css/app.js

resources/css /admin/member/index.js необходимо хранить внутри public/build/assets/css/admin/member/index.js
resources/css/admin/lead/index.js необходимо хранить внутри public/build/assets/css/admin/lead/index.js

**

Это аналогично и для файлов JS.**
Ниже приведен код, который я пробовал.

Код: Выделить всё

import { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
export default defineConfig({
build: {
outDir: "public/build",
},
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/all.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.js",
"resources/js/app/modules/admin/member/member.js",
"resources/js/config/core/dev/app.js",
],
refresh: true,
}),
],
});
Может ли кто-нибудь помочь мне это исправить? Я впервые использую Vite. В настоящее время я пытаюсь вручную обновить проект Laravel 5.2 до Laravel 10. Поэтому я стараюсь сохранить большую часть файловой структуры прежней.

Подробнее здесь: https://stackoverflow.com/questions/789 ... cific-path
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Php»