如何在浏览器中使用AJV，遇到module not found错误怎么解决？

可直接运行的完整代码示例 #

<script src="https://cdnjs.cloudflare.com/ajax/libs/ajv/8.6.1/ajv.min.js"></script>
<script>
  ;(function () {
    const Ajv = window.Ajv
    // 初始化AJV实例，可根据需求传入配置项
    const ajv = new Ajv({ allErrors: true })
    
    // 示例：定义校验规则
    const userSchema = {
      type: 'object',
      properties: {
        username: { type: 'string', minLength: 2 },
        age: { type: 'number', minimum: 16 }
      },
      required: ['username']
    }
    // 生成校验函数
    const validateUser = ajv.compile(userSchema)

    // 测试合法数据
    const validUser = { username: '李明', age: 20 }
    console.log('合法数据校验结果：', validateUser(validUser)) // 输出true

    // 测试非法数据
    const invalidUser = { username: 123, age: 15 }
    console.log('非法数据校验结果：', validateUser(invalidUser)) // 输出false
    console.log('校验错误详情：', validateUser.errors) // 输出具体错误信息
  })()
</script>

原代码报错原因 #

• 你引用的ajv7.min.js是v8版本提供的v7语法兼容构建包，普通业务场景不需要使用，直接引用ajv.min.js即可
• AJV v8所有浏览器端构建包的全局挂载变量统一为window.Ajv，不存在window.ajv7的挂载对象，取值错误导致module not found报错

使用注意事项 #

• 如果需要用到邮箱、手机号等格式校验能力，需要额外引入AJV的format扩展包，再通过addFormat方法挂载到实例使用
• 只有当你需要兼容旧版v7版本的业务代码时，才需要使用ajv7.min.js兼容包，初始化逻辑和普通v8版本完全一致，不需要修改全局变量取值逻辑

内容的提问来源于stack exchange，提问作者Aki Sharipov