Import module into vue.config.js

Question

I want to import the npm package vue-remove-attributes to remove my "data-testid" attributes from the DOM. https://www.npmjs.com/package/vue-remove-attributes

In the README they say i've to pass the module to vue-loader in my webpack config. I have webpack installed but my only config file is vue.config.js which looks like this:

module.exports = {
  publicPath: "./",
  productionSourceMap: false,
  lintOnSave: process.env.NODE_ENV !== "production",
}

I tried importing the module like this

const createAttributeRemover = require('vue-remove-attributes');

module.exports = {
  publicPath: "./",
  productionSourceMap: false,
  lintOnSave: process.env.NODE_ENV !== "production",

  configureWebpack: {
    plugins: new createAttributeRemover(),
    module: {
      rules: [
        {
          test: /\.vue$/,
          use: {
            loader: "vue-loader",
            options: {
              compilerOptions: {
                modules: [createAttributeRemover("data-testid")]
              }
            }
          }
        }
      ]
    }
  },
};

but that doesn't seem to work. Any ideas how I can import the npm package in my vue config?

Ohgodwhy · Accepted Answer · 2021-05-11 07:58:51Z

1

You didn't tag vue-cli, but you're using the configureWebpack property so it's my assumption that you are. You need to modify the existing loader rule. You can tap into it with chaining and add your options:

chainWebpack: config => {
    config.module
      .rule('vue')
      .use('vue-loader')
        .tap(options => {
          // modify the options...
          options.compilerOptions.modules = [createAttributeRemove('data-testid')]
          return options
        })

answered May 11, 2021 at 7:58

Ohgodwhy

50.8k11 gold badges86 silver badges114 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Import module into vue.config.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related