\n
My folder structure
\n\nMy array of js paths
\nLess array the same as js
\n\n\ni still dont get my files, but debug error is disappear
\nlet compileJS = (str, str2) => {\n console.log(str,str2)\n mix.js(str, str2);\n};\n\nglob(\"./components/**/*.js\", (err, files) => {\n files.map((p) => {\n pathsJS.push({\n in: p,\n out: p.replace(\"./components/\", \"./dist/views/\"),\n });\n });\n // console.log(pathsJS);\n pathsJS.map((p) => {\n compileJS(p.in, p.out);\n });\n});
\r\nThe problem was that all libraries by default make the issuance of paths an asynchronous method. Mix works synchronously. I installed a faster version of the plugin, did the output of paths with synchronous and placed the mix function in the same function. Thus, the code is executed at once.
\nconst glob = require(\"fast-glob\");\n\n\nlet compile = () => {\n function getFilesJS(baseSrc) {\n return glob.sync(\"./components/**/*.js\", {\n onlyFiles: true,\n });\n }\n let filesjs = getFilesJS();\n filesjs.map((p) => {\n pathsJS.push({\n in: p,\n out: p.replace(\"./components/\", \"./dist/views/\"),\n });\n });\n\n pathsJS.map((p) => {\n mix.js(p.in, p.out);\n });\n function getFilesLESS() {\n return glob.sync(\"./components/**/*.less\", {\n onlyFiles: true,\n });\n }\n let filesless = getFilesLESS();\n filesless.map((p) => {\n pathsLess.push({\n in: p,\n out: p.replace(\"./components/\", \"./dist/views/\"),\n });\n });\n\n pathsLess.map((p) => {\n mix.less(p.in, p.out.replace(\"style.less\", \"\"));\n });\n mix.less(\"./src/less/styles.less\", \"./dist/template_styles.css\");\n mix.js(\"./src/js/script.js\", \"./dist/script.js\");\n};
\r\nReputation: 443
I have a tiered folder structure with stylesheets and script files. I need to keep the same structure in the output folder. For all scripts and styles, I get an array of paths, convert them and give them to the mix.
The problem is that the mix accepts my paths but doesn't create the desired structure. Previously I did the array of paths manually, now I am not getting the right one. There are no compiler errors. I still use mix.js(str, str2)
and mix.less(str, str2)
The paths I received are similar to those that I wrote manually
But if I start the nodejs debugging process, then I will see
My folder structure
My array of js paths
Less array the same as js
i still dont get my files, but debug error is disappear
let compileJS = (str, str2) => {
console.log(str,str2)
mix.js(str, str2);
};
glob("./components/**/*.js", (err, files) => {
files.map((p) => {
pathsJS.push({
in: p,
out: p.replace("./components/", "./dist/views/"),
});
});
// console.log(pathsJS);
pathsJS.map((p) => {
compileJS(p.in, p.out);
});
});
Upvotes: 4
Views: 855
Reputation: 123
In my case there was two bugs with nodejs and broken symlink to storage (after moving project folder into other place) (laravel 8). So what i've done:
php artisan storage:link
$ node -v
18.12.1
$ n 14.21.2
installed
$ node -v
14.21.2
Upvotes: 0
Reputation: 443
The problem was that all libraries by default make the issuance of paths an asynchronous method. Mix works synchronously. I installed a faster version of the plugin, did the output of paths with synchronous and placed the mix function in the same function. Thus, the code is executed at once.
const glob = require("fast-glob");
let compile = () => {
function getFilesJS(baseSrc) {
return glob.sync("./components/**/*.js", {
onlyFiles: true,
});
}
let filesjs = getFilesJS();
filesjs.map((p) => {
pathsJS.push({
in: p,
out: p.replace("./components/", "./dist/views/"),
});
});
pathsJS.map((p) => {
mix.js(p.in, p.out);
});
function getFilesLESS() {
return glob.sync("./components/**/*.less", {
onlyFiles: true,
});
}
let filesless = getFilesLESS();
filesless.map((p) => {
pathsLess.push({
in: p,
out: p.replace("./components/", "./dist/views/"),
});
});
pathsLess.map((p) => {
mix.less(p.in, p.out.replace("style.less", ""));
});
mix.less("./src/less/styles.less", "./dist/template_styles.css");
mix.js("./src/js/script.js", "./dist/script.js");
};
Upvotes: 1