Error: ENOENT: no such file or directory, stat Laravel mix bug

user_10895051 0
Viewed 165

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

My config

But if I start the nodejs debugging process, then I will see

enter image description here

My folder structure

enter image description here

My array of js paths

Less array the same as js

enter image description here

enter image description here

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);
    });
});

laravel-mix laravel webpack javascript
1 Answers

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");
};

user_108950510
Related