Question

我正在我的nuxt / webpack项目中尝试使用https://github.com/itgalaxy/webpack-modernizr-loader这个加载程序。

不幸的是，与普通的webpack项目相比，加载器的添加方式有所不同，我对这个问题的nuxt文档没有真正的了解：

https://nuxtjs.org/api/configuration-build#loaders

我有一个带有最小nuxt项目的示例存储库： https://github.com/Jones-S/nuxt-modernizr

在我的nuxt.config.js中（等同于webpack配置）我试图在我的pages/index.vue中加入加载程序并使用它。

不幸的是，我收到一个未安装modernizr的错误消息。事实并非如此。

如果有人可以对此进行简短的介绍并告诉我如何在nuxt.js中正确使用加载程序，我将非常高兴。

为简洁起见，我是nuxt.config.js的一部分

build: {
  /*
  ** You can extend webpack config here
  */
  extend(config, { isDev, isClient }) {
    // Run ESLint on save
    if (isDev && isClient) {
      config.module.rules.push({
        enforce: 'pre',
        test: /\.(js|vue)$/,
        loader: 'eslint-loader',
        exclude: /(node_modules)/
      })

      config.module.rules.push({
        test: /\.modernizrrc\.js$/,
        use: { loader: 'webpack-modernizr-loader' }
      })

      config.resolve.alias['modernizr'] = '/.modernizrrc.js'

    }
  }
}

我正在推送新的加载器，并在下面注册一个别名。但是我会得到这个错误：

ERROR  Failed to compile with 1 errors
This dependency was not found:
* modernizr in ./node_modules/babel-loader/lib??ref--2-0!./node_modules/vue-loader/lib??vue-loader-options!./pages/index.vue?vue&type=script&lang=js&
To install it, you can run: npm install --save modernizr

非常感谢您。欢呼

如何在nuxt.js中使用Webpack加载程序？

0 个答案: