javascript – Webpack代码拆分打破了jue导入与vueJs组件

尝试加载具有动态导入代码的vueJs组件时,Jest会抛出错误.

零件：

test() {
                return true;
            }
        }
    }

测试：

import TileEditModal from "./TileEditModal.vue"

即使没有运行测试,只需导入该组件也会引发以下错误：

  return import( /* webpackChunkName: "Modal" */"../pages/common/Modal.vue");
           ^^^^^^
SyntaxError: Unexpected token import

  at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/ScriptTransformer.js:289:17)
  at Object.

我试过这个solution,但它对我不起作用.

我正在使用带有jest的jest-vue-preprocessor：

  "jest": {
    "modulefileExtensions": [
      "js","vue"
    ],"transform": {
      "^.+\\.js$": "

我也尝试将env.test预设添加到babel：

{
    "presets": [
      "es2015","stage-2","stage-0"
    ],"env": {
      "test": {
        "presets": [
          "es2015","stage-0"
        ]
      }
    } 
  }

到目前为止没有任何作用,任何想法我真的希望将这些代码拆分为单个组件.

最佳答案

对我有用的解决方案是使用dynamic import babel plugin,但也可以在没有缓存的情况下运行.

jest –no-cache

不幸的是,在那之后再次使用缓存运行它仍然无法通过测试,所以我不确定发生了什么,但是如果我离开–no-cache它就可以工作.只是让测试更慢.

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。