How can I translate the instructions/code that would work on the webpack.config.js to the vue.config-CodePudding

I’m using vue-cli which, instead of creating a webpack.config.js uses a vue.config.js:

const { defineConfig } = require('@vue/cli-service')

module.exports = defineConfig({
  transpileDependencies: true,
 
})

as soon as Install a specific npm package Vue is trowing 17 errors:

Vue Cli uses the latest version of webpack (5). But this new NPM package I've installed is only stable of webpack version 4:

On their npmjs page they say:

If you want to use this package on your project with Webpack v5 you need to add the fallback to your webpack.config.js file:

module.exports = {
    resolve: {
        fallback: {
            assert: require.resolve('assert'),
            http: require.resolve('stream-http'),
            https: require.resolve('https-browserify'),
            os: require.resolve('os-browserify/browser'),
            stream: require.resolve('stream-browserify'),
        },
    },
};

How can I translate the instructions/code that would work on the webpack.config.js instructions, to the vue.config.js file? I know this is probably a basic JS thing but I’m stuck.

Is there anybody out there that could point me in the right direction?

many thanks in advance

CodePudding user response：

Can you try this? found this on vue-cli docs

const { defineConfig } = require('@vue/cli-service')

module.exports = defineConfig({
    transpileDependencies: true,
    configureWebpack: {
        resolve: {
            fallback: {
                assert: require.resolve('assert'),
                http: require.resolve('stream-http'),
                https: require.resolve('https-browserify'),
                os: require.resolve('os-browserify/browser'),
                stream: require.resolve('stream-browserify'),
            },
        },
    }
})