类型错误: Ajv不是一个构造函数。

Question

类型错误: Ajv不是一个构造函数。

11

我有一个课程，我尝试使用new关键字实例化Ajv，但是出现以下错误：

TypeError: Ajv不是构造函数

代码:

import * as Ajv from "ajv";

    export class ValidateJsonService {
        validateJson(json, schema) {
            console.log(Ajv);
            let ajv = new Ajv({ allErrors: true });
            if (!ajv.validate(schema, json)) {
                throw new Error("JSON does not conform to schema: " + ajv.errorsText())
            }
        }
    }

控制台日志：

这段代码以前是可以正常工作的，也是 Ajv 的使用方法。来自 Ajv 文档：

最快的验证调用：

var Ajv = require('ajv');
var ajv = new Ajv(); // options can be passed, e.g. {allErrors: true}
var validate = ajv.compile(schema);
var valid = validate(data);
if (!valid) console.log(validate.errors);

为什么我会收到这个错误？

看看我如何导入Ajv库的底部 - systemjs.config.js：

(function (global) {
    System.config({
        paths: {
            // paths serve as alias
            'npm:': 'lib/js/'
        },
        // map tells the System loader where to look for things
        map: {
            app: 'app', 
            // angular bundles
            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
            '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
            '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
            // other libraries
            'rxjs': 'npm:rxjs',
            'angular2-in-memory-web-api': 'npm:angular2-in-memory-web-api',
            'angular2-google-maps/core': 'npm:angular2-google-maps/core/core.umd.js',
            'ajv': 'npm:ajv/dist/ajv.min.js',
            'primeng': 'npm:primeng'

- BeniaminoBaggins

3

从'ajv'导入Ajv。 - esp

最终我选择了这个。 - BeniaminoBaggins

@BeniaminoBaggins 你知道我应该在哪里更改它“let ajv = new Ajv.default({ allErrors: true });”吗？我的意思是在node_modules > ajv > lib下面吗？ - soccerway

@soccerway 不是在node_modules中。在你自己的代码中，当你想要使用Ajv时，它将替换我问题中的这一行: let ajv = new Ajv({ allErrors: true }); 和 var ajv = new Ajv(); // options can be passed, e.g. {allErrors: true}。它只是创建一个新的Ajv实例，然后使用它。 - BeniaminoBaggins

抱歉，我的代码中没有使用AJV...我还没有用过那个。 - soccerway

4个回答

2

虽然这是一个旧问题和旧答案，但我认为已接受的答案不是理想的，同时也留下了未解答的问题，因此我仍然要补充我的意见:

造成这种情况的原因是 ajv 使用了 export default 或 export = 语法，而您正在使用 import * as 导入来自 ajv 模块的所有导出成员的对象，其中默认导出是一个名为 default 的属性。

导入默认构造函数的最合理方法是使用：

import Ajv from 'ajv';
const ajv = new Ajv(...);

rather than

import * as Ajv from 'ajv';
const ajv = new Ajv.default(...); // Ajv is an object containing _all_ exports from the ajv module

如果你非常希望使用import *，那么这个方法至少会更加清晰，使得Ajv成为构造函数而不是Ajv.default。

import * as AjvModule from 'ajv';
const {default: Ajv} = AjvModule;

如果使用 require 而不是 import 来访问使用 export default 的模块导出的成员，它将表现得像 import * as Ajv，也就是说，你将得到一个包含一个 default 属性的对象。

因此，以下内容是等价的：

// Pre-ES6 require
const Ajv = require('ajv').default;
const ajv = new Ajv(...);

// Import default
import Ajv from 'ajv';
const ajv = new Ajv(...);

// Import entire module and use default property
import * as Ajv from 'ajv';
const ajv = new Ajv.default(...); // just ugly!

// Import entire module as AjvModule and assign constructor function to Ajv
import * as AjvModule from 'ajv';
const {default: Ajv} = AjvModule;
const ajv = new Ajv(...);

如果您需要导入默认导出和其他导出成员，可以这样做而不必使用import * as：

import Ajv, {EnumParams} from 'ajv';
const ajv = new Ajv(...);

个人认为被接受的答案有些缺陷，因为如果你只对导入ajv构造函数感兴趣，将它分配给Ajv变量而不是包含构造函数作为名为default属性的对象 - 然后使用new Ajv.default语法创建类 - 这看起来很奇怪。

- JHH

仅有被接受的答案在Nodejs中对我有效，但在webpack中无效。在webpack中，仅有你的答案有效，使用ajv 7.2.1，导入Ajv。 - cyrf

0

我之前在一个项目中使用AJV，该项目的目标是使用这个tsconfig和相应的typescript来支持CommonJS。

{
    "module": "commonjs",
    "moduleResolution": "node",
}

import Ajv from 'ajv';

const ajv = new Ajv.default();

但在更新我们的项目后，我无法使用上述内容。我开始收到一个错误消息，Ajv.default不是一个构造函数。尝试使用new Ajv()也不起作用...出现了类似的仅限TypeScript的错误。解决方案是做这个愚蠢的事情（注意：智能感知仍然有效！）：

{
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
}

import AjvDefault from 'avj';

const Ajv = AjvDefault as unknown as typeof AjvDefault.default;
const ajv = new Ajv();

我真的希望这能帮到某人。

- Ryan Wheale

-2

简单来说，你不需要做任何事情，只需安装ajv包 "npm install ajv" 它将解决avj不是构造函数的问题

- Arpit Mishra

这并没有回答问题。一旦您拥有足够的声望，您将能够评论任何帖子；相反，提供不需要询问者澄清的答案。- 来自审核 - zenly

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- BeniaminoBaggins · Accepted Answer

我看到Ajv有一个默认函数，所以我将我的代码更改为：

let ajv = new Ajv.default({ allErrors: true });

不完全确定正在发生什么，但它起作用。