Vue +开玩笑+打字稿:意外令牌=类静态函数

时间:2020-03-13 21:32:22

标签: vue.js jestjs

尝试用玩笑创建单元测试。我已经尝试过ts-jest,有很多问题。尝试通天塔,越来越近。实际有一个测试工作。但是后来我遇到了这个。

static cachedVendors = [];
                     ^

SyntaxError: Unexpected token =

文件如下

//imports up here somewhere
export default class Vendor {
    public static cachedVendors: Vendor[] = [];
    ...more code
}

有趣的配置

const { defaults: tsjPreset } = require("ts-jest/presets");

module.exports = {
    ...tsjPreset,
    transform: {
        "^.+\\.[t|j]s?$": "babel-jest",
        ".*\\.(vue)$": "vue-jest"
    },
    moduleNameMapper: {
        "^@/(.*)$": "<rootDir>/src/$1",
        "^common/(.*)$": "<rootDir>/src/common/$1",
        "^price/(.*)$": "<rootDir>/src/price/$1",
        "^eligibility/(.*)$": "<rootDir>/src/eligibility/$1"
    }
};

我已经删除了... tsjPreset东西,并得到了相同的错误。

我的babel.config.js

module.exports = {
    presets: [["@babel/preset-env", { targets: { node: "current" } }], "@babel/preset-typescript"],
    plugins: [["@babel/plugin-proposal-export-default-from"]]
};

正如我所说,我还有另一个正在运行的文件,看起来像这样

import Vue from "vue";
import { Component, Prop, Inject, Watch } from "vue-property-decorator";
import moment from "moment";
import * as _ from "lodash";


export const DATE_FORMAT = "MM-DD-YYYY";


@Component({
})
export default class PEMDatePicker extends Vue {

    @Prop()
    label: string;

    @Prop()
    value: string;

    @Prop()
    rules: Array<Function>; //https://vuetifyjs.com/en/components/forms#creating-rules

    public componentsLabel = "";
    public componentsDate = "";
    public showPicker = false;
    public componentsDateInput: string = moment().format("MM/DD/YYYY");

    public mounted() {

        this.componentsLabel = this.label ? this.label : "Date";
        this.setDate(this.value);

        this.$emit('input', this.value);

    }

    @Watch("value")
    public syncModel() {
        if (this.componentsDate != this.value) {

            this.setDate(this.value);
        }

        this.componentsDateInput = this.getDate;

    }

    @Watch("componentsDate")
    public syncDates() {
        this.componentsDateInput = this.getDate;
        this.$emit('input', this.componentsDate);
    }

    get getDate() {
        return this.componentsDate ? moment(this.componentsDate).format("MM/DD/YYYY") : "";
    }

    public closePicker() {
        this.showPicker = false;
        //@ts-ignore
        this.$refs.input.focus();
    }

    public handleEnterKey(event) {

        this.setDate(event.target.value);
        this.showPicker = false;
    }

    setDate(dateIn) {

        this.componentsDate = dateIn && moment(dateIn).isValid() ? moment(dateIn).format("YYYY-MM-DD") : null;
    }
}

对此文件的此测试成功运行。因此,它正在翻译打字稿。但是由于某种原因不在该特定文件上。我很茫然。

1 个答案:

答案 0 :(得分:2)

Babel对新的js语言功能有些保守(特别是如果您未使用最新版本的babel)。在这种情况下,您似乎需要此babel插件:

https://babeljs.io/docs/en/babel-plugin-proposal-class-properties