首页 > 解决方案 > (Vue.js | Jest | Babel) 导入特定 vue 文件时出现意外令牌

问题描述

我正在导入一个仅包含模板标签的 vue 文件中的脚本的 vue 文件
然后我导入 js 文件以帮助我做我需要的事情
在最后的导入中是问题(我认为),但只是这个文件,因为我已经用另一个测试过并且测试通过了

PS:对不起我的新手问题和我的英语,这是我的第一个问题。感谢您的关注

sales.test.js

import ApexChart from 'vue-apexcharts'
import BootstrapVue from 'bootstrap-vue'
import sinon from 'sinon'
import { shallowMount, createLocalVue } from '@vue/test-utils'

import salesPage from '../src/views/vendas/Vendas'

包.json

"jest": {
    "moduleFileExtensions": [
      "js",
      "vue"
    ],
    "moduleNameMapper": {
      "^@/(.*)$": "<rootDir>/src/$1"
    },
    "transform": {
      "^[^.]+.(vue|jsx)$": "vue-jest",
      "^.+\\.(js|jsx)$": "babel-jest"
    },
    "snapshotSerializers": ["jest-serializer-vue"]
  }

.babelrc

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry",
        "corejs": 2,
        "targets": {
          "esmodules": true,
          "node": "current"
        }
      }
    ]
  ],
  "plugins": [
    ["@babel/plugin-syntax-dynamic-import"],
    ["@babel/plugin-syntax-jsx"],
    [
      "@babel/plugin-transform-runtime",
      {
        "corejs": 2,
        "regenerator": true
      }
    ]
  ]
}

函数.js

'use strict'

import moment from 'moment'

export function dateFormatter(date) {
  return moment(date).format('DD/MM/YYYY')
}

export function changeInitialDate(date) {
  if (date) {
    this.disabledDatesEnd = null
    this.disabledDatesEnd = new Object()
    this.disabledDatesEnd.to = new Date(date)
  }
}

export function changeFinalDate(date) {
  if (date) {
    this.disabledDatesStart = null
    this.disabledDatesStart = new Object()
    this.disabledDatesStart.from = new Date(date)
  }
}

export function cnpjFormatter(cnpj) {
  return cnpj.toString().replace(/[^0-9a-zA-Z]+/g, '')
}

错误

Jest encountered an unexpected token

    This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

    By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

    Here's what you can do:
     • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
     • If you need a custom transformation specify a "transform" option in your config.
     • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

    You'll find more details and examples of these config options in the docs:
    https://jestjs.io/docs/en/configuration.html

    Details:

    SyntaxError: /home/victor/development/accesys/AccCRM/Sources/cliente-web-clientes/unknown: Unexpected token (16:0)

      14 |   changeFinalDate,
      15 |   cnpjFormatter,
    > 16 | } from "../../functions";
         | ^
      17 | 
      18 | import {
      19 |   onClassChange,

      at Object._raise (node_modules/@babel/parser/src/parser/error.js:60:45)
      at Object.raiseWithData (node_modules/@babel/parser/src/parser/error.js:55:17)
      at Object.raise (node_modules/@babel/parser/src/parser/error.js:39:17)
      at Object.unexpected (node_modules/@babel/parser/src/parser/util.js:139:16)
      at Object.parseExprAtom (node_modules/@babel/parser/src/parser/expression.js:1186:20)
      at Object.parseExprAtom (node_modules/@babel/parser/src/plugins/jsx/index.js:535:22)
      at Object.parseExprSubscripts (node_modules/@babel/parser/src/parser/expression.js:563:23)
      at Object.parseUpdate (node_modules/@babel/parser/src/parser/expression.js:543:21)
      at Object.parseMaybeUnary (node_modules/@babel/parser/src/parser/expression.js:527:17)
      at Object.parseExprOps (node_modules/@babel/parser/src/parser/expression.js:343:23)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        1.524s

标签: javascriptvue.jsjestjsbabeljs

解决方案


可能是导入中的尾随逗号吗?

由此:

import { changeFinalDate, cnpjFormatter, } from "../../functions";
                                       ^

对此:

import { changeFinalDate, cnpjFormatter } from "../../functions";

推荐阅读