Webpack support

[reindert-vetter]

@NWBY Webpack support
I believe this could easily be achieved by using Laravel Mix

[reindert-vetter]

🚧 Since I have no experience with this myself, I will not implement this myself. If you would like to use your own repo, we can link to it from the documentation.

• When the project is complete, we can make it an official repo.
• 100% test coverage please (if possible).
• Several senior programmers must be enthusiastic about this and approve the code.

[Wulfheart]

Laravel Mix is basically a build tool for js assets and it’s already working.

[reindert-vetter]

@Wulfheart I haven't looked into it yet. Can I take over the entire documentation directly? Probably not, but do you know what remains to be done?

[NWBY]

@reindert-vetter To support Webpack using Laravel Mix, Confetti would need to include two files at the root of the repository:

• A package.json which has a couple of scripts to run webpack and a couple of dependencies such as laravel-mix.
• A webpack.mix.js which could include a basic configuration for compiling JS and SCSS files to a public directory.

Finally, in a root view file we would need to import the compiled JS file from the public directory.

Happy to open a PR to show you how this would look.

[reindert-vetter]

@NWBY That is simple indeed. Could you create a pull request? I would appreciate that.

[reindert-vetter]

@NWBY Probably Docker installation guide at https://www.confetti-framework.com/docs/get-started/installation.html#docker will not expose the css and js files properly yet. I don't mind that very much. But if you have some Docker experience, you could look into that too. 🤷‍♂️

[almas1992]

I have no hesitation in recommending esbuild, an extremely fast JavaScript bundler and minifier, faster than Webpack;

[NWBY]

Totally agree, that esbuild is much faster. The reason for the recommendation of using Laravel Mix (which is just a wrapper over Webpack) is that if a user wants to use something like Vue and TailwindCSS for example in their application they would need to do something as simple as:

const mix = require("laravel-mix");
const tailwindcss = require("tailwindcss");

mix.vue("resources/js/app.js", "public/js")
    .postCss('resources/css/app.css', 'public/css', [
        require('tailwindcss'),
    ]);

One of the many things that make Laravel so great is how simple it makes things such as front-end setup.

[Wulfheart]

I am currently working on a thing called “blend”. Currently I have esbuild and postCss working. Faster than webpack and the same simple api like mix.

[reindert-vetter]

Looks good, but the purpose of Confetti is to provide all the features that Laravel has. So I prefer not to use other frameworks.

[Wulfheart]

Yeah. Switching this is simple on the user side. However, be aware that mix has some issues in the newest version with Windows. Currently you need to run yarn install instead of npm install on some machines. Just to keep in mind if there are some questions.

[reindert-vetter]

Thanks for your tip! @NWBY, maybe nice to make sure you're using the same version as Laravel is using.