[英]TypeError: Ajv is not a constructor
我有这个类,我尝试使用 new 关键字实例化Ajv ,但出现此错误:
类型错误: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'
我看到 Ajv 有一个默认功能,所以我将代码更改为:
let ajv = new Ajv.default({ allErrors: true });
不是 100% 确定那里发生了什么,但它有效。
旧问题和旧答案,但由于我认为接受的答案并不理想,而且还留下未回答的问题,我仍在添加我的 $.02:
造成这种情况的原因是ajv
使用export default
或export =
语法,并且您使用import * as
它导入一个对象,其中包含来自ajv
模块的所有导出成员,其中默认导出是一个名为default
的属性。
导入默认构造函数最合理的方式是使用:
import Ajv from 'ajv';
const ajv = new Ajv(...);
而不是
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
语法创建类 - 这看起来很奇怪。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.