create-react-app + forgJS

[daniele-zurico]

Hi there,
I'm trying to use forgJS with create-react-app but unfortunately it raise the error:

1!] Error: 'Rule' is not exported by node_modules/@cesium133/forgjs/index.js

this is how I used:

import * as React from 'react';
import { Rule } from '@cesium133/forgjs';
import styles from './styles.css';

const ExampleComponent = ({ text }: any) => {
  const floatRule = new Rule(
    {
      type: 'float',
      min: 100,
    },
    null
  );
  const result = floatRule.test(200.3);
  console.log(result);

  return <div className={styles.test}>Example Component: {text}</div>;
};

export default ExampleComponent;

To have a working example is enough to do:
npx create-react-library
and then install the package forgJs.

Can someone help me on that please?

[oussamahamdaoui]

Hello, i haven't tried it but you should try import Rule from '@cesium133/forgjs'; tell me if this solves your problem

[daniele-zurico]

No it doesn’t

[oussamahamdaoui]

this worked for me can you give me more information i dont get the problem that you got

[daniele-zurico]

Are you sure you tried on ‘npx create-react-library’ I realised on the title I put the CRA that is the wrong one

[oussamahamdaoui]

can you tell me the steps you went thought i did:
1- npx create-react-library
2- named it pr
3- went to the pr folder
4- did npm i @cesium133/forgjs
5- changed the exemple component to use forgjs
6- did npm start

i didn't get any problem

[daniele-zurico]

1-npx create-react-library
2- pr
3- npm
4- typescript
5- cd pr
6- cd src
7- replace the content of index.tsx

import * as React from 'react';
import {Rule} from '@cesium133/forgjs';
import styles from './styles.css';

const ExampleComponent = ({ text }: any) => {
  const floatRule = new Rule(
    {
      type: 'float',
      min: 100,
    },
    null
  );
  const result = floatRule.test(200.3);
  console.log(result);

  return <div className={styles.test}>Example Component: {text}</div>;
};

export default ExampleComponent;

8- npm start

Error:

[!] Error: 'Rule' is not exported by node_modules/@cesium133/forgjs/index.js
https://github.com/rollup/rollup/wiki/Troubleshooting#name-is-not-exported-by-module
src/index.tsx (2:9)
1: import * as React from 'react';
2: import { Rule } from '@cesium133/forgjs';
            ^
3: import styles from './styles.css';

The folder you edit is the demo folder that is the project that run your library

[oussamahamdaoui]

Apparently imports dont work with type script you can use require it worked for me try this and tell me if you get errors: const { Rule } = require('@cesium133/forgjs');

[daniele-zurico]

Unfortunately is not correct! Import works really well with typescript. I tried to use it in a CRA create-react-app newtest —typescript.
Not sure what stop it to work over here instead

[oussamahamdaoui]

Did the require work for you ?

[daniele-zurico]

It create a circular recoursion on the demo. However I don’t think require is the best solution

[oussamahamdaoui]

Id keep looking. Please tell me if you find a fix for this