Problème d'utilisation du paquet NPM dans une application Laravel

Question

J'utilise Laravel depuis des années, mais je n'avais jamais utilisé de paquets NPM dans mes applications Laravel jusqu'à présent. J'utilise Laravel Valet comme environnement de développement.

J'essaye d'utiliser un paquet simple qui s'interface avec le supprimer le paquet js.bg mais je n'arrive pas à le faire fonctionner après des heures à essayer différentes choses.

Voici ce que j'ai fait :

1. Installé le paquet via npm install remove.bg .
2. Le paquet se plaignait de ne pas pouvoir trouver les modules dont il dépendait (unirest, http, etc.), alors je les ai installés via npm install et j'ai même ajouté ces replis puisqu'il se plaignait de Webpack 5 et de polyfill :

Mon fichier webpack.mix.js :

mix.webpackConfig({
    resolve: {
        fallback: {
            fs: require.resolve('browserify-fs'),
            crypto: require.resolve('crypto-browserify'),
            stream: require.resolve('stream'),
            http: require.resolve('stream-http'),
            https: require.resolve('https-browserify'),
            path: require.resolve('path-browserify'),
            zlib: require.resolve('browserify-zlib'),
        },
    },
});

3. Dans mon resources/js/bootstrap.js J'ai ajouté :

   import { RemoveBgResult, RemoveBgError, removeBackgroundFromImageBase64 } from 'remove.bg'; window.Removebg = require('remove.bg');

4. Exécuter npm run dev sans aucune erreur.

5. Inclus <script src="{{ mix('/js/app.js') }}"></script> dans mon modèle de lame.

Cependant, lorsque je visualise ma page, j'obtiens ces erreurs dans la console :

app.js:137237 Uncaught TypeError: Cannot read properties of undefined (reading 'prototype')
    at Object.inherits (app.js:137237)
    at Object../node_modules/browserify-zlib/lib/index.js (app.js:28688)
    at __webpack_require__ (app.js:139212)
    at Object../node_modules/unirest/index.js (app.js:131192)
    at __webpack_require__ (app.js:139212)
    at Object../node_modules/remove.bg/dist/index.js (app.js:108502)
    at __webpack_require__ (app.js:139212)
    at Module../resources/js/bootstrap.js (app.js:16242)
    at __webpack_require__ (app.js:139212)
    at Object../resources/js/app.js (app.js:16230)

Je suis perplexe. Qu'est-ce que je fais de mal ici ?

Answer 1

Vous pouvez manquer sur le fichier webpack.mix.js

Ajoutez cette ligne

mix.js('resources/js/app.js', 'public/js');