如何使用Nuxt 2在node_modules中转换依赖项?

时间:2018-10-02 17:07:48

标签: javascript vue.js babeljs nuxt.js nuxt-edge

我已经阅读了使用Nuxt转译node_modules的问题,但是据说新的Nuxt 2已通过transpile文件中的nuxt.config.js选项解决了这个问题。

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

这是我所拥有的:

export default {
  router: {
    base: '/',
  },
  build: {
    transpile: [
      'choices.js',
      'lazysizes',
      'swiper',
      'vee-validate'
    ],
    extractCSS: true
  },
  srcDir: 'src/',
  performance: {
    gzip: true
  },
  render: {
    compressor: {
      threshold: 100
    }
  },
  dev: false
}

我删除了一些无关紧要的内容,以便于阅读。

当我运行npm run buildnuxt build)时,已编译的JS文件应包含对es6和es7代码的引用,例如constlet等(应为{{1 }}。

我认为此问题来自 Swiper 。它似乎在内部依赖于引起问题的Dom7。

我想尽可能将这些var依赖项编译为es5。我不确定当前的设置在这方面实际上是否在做任何事情。

我相信Nuxt将node_modules用于通天塔,但我什至尝试了以下方法但没有成功:

vue-app

那里也没有太多快乐。在最终版本中没有什么不同。

我正在使用Nuxt babel: { presets: [ '@babel/preset-env' ], plugins: [ '@babel/plugin-syntax-dynamic-import' ] }

任何帮助表示赞赏。谢谢!

2 个答案:

答案 0 :(得分:1)

我有完全相同的问题。

已弃用正在构建的供应商选项,因此根据我在这里读到的内容,https://medium.com/nuxt/nuxt-2-is-coming-oh-yeah-212c1a9e1a67#a688

只是被忽略了

我设法将案件隔离到“ swiper”库中。如果我从项目中删除它,则对letconstclass的所有引用都将消失。我也尝试了transpile选项,但似乎没有任何效果。

您会尝试从项目中排除swiper吗,看看我们是否可以找出问题所在?

答案 1 :(得分:0)

您还需要转送Dom7,因此Nuxt配置应具有:

build: {
    transpile: [
      'swiper',
      'dom7',
    ],
}