Skip to content

Palisand/ie-ajv-tester

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

This project was bootstrapped with Create React App.

You might find yourself in a pickle when attempting to provide asynchronous json schema validation via the delightfully performant AJV for a Create React App (CRA) app running in an Internet Explorer (IE) setting.

IE 11 does not support async functions but AJV provides optional transpilation of its generated validation code through ajv-async, which uses NoDent.

After installing ajv-async and running your CRA app you will probably come across this error:

Failed to compile.

./node_modules/nodent/nodent.js
Module parse failed: Unexpected character '#' (1:0)
You may need an appropriate loader to handle this file type.
| #!/usr/bin/env node
| 
| 'use strict';

You can reproduce this error for the app in this repository by importing ./validatorWithAjvAsync as the validator within App.js.

Ok, no problem, you can just do what it says and write a Webpack loader of your own. Oh wait, doing this the right way (no hacky code) would involve ejecting from CRA and you may not want to do that NoDent is a node program and can't run in the browser.

At this point, you have 3 options:

  1. Maintain a fork of CRA with a custom Webpack configuration.
  2. Eject from CRA and provide your custom or third-party Webpack loader.
  3. Drop asyncronous validation in IE contexts.

You can test this by removing $async: true from schema.json.

  1. Use an alternate transpilation method through the processCode option (see AJV Options).

Transpilation can be handled by babel-standalone. You can test it by importing ./validatorWithBabel as the validator within App.js. This solution only serves as a demonstration and does not include an environment check; it will run as-is on all browsers.

  1. If your schemas are static, you can use the ajv-cli to generate the validation function, which CRA will compile, eliminating the need for a separate transpiler. (See this issue).

./validateCompiled.js was generated by running npm run ajv-compile. Generating validation functions is still a BETA feature of ajv-cli; changes have been made to the generated code. These changes include disabling eslint and using es6 exports. You can import it within App.js to test solution 5.