Unable to load CSS rules

[FatiMooni]

I am occasionally getting the below errors when using <PhoneInput /> component

error :

dependencies :

antd-phone-input: "^0.1.4" antd : "^5.4.2" react: "^18.2.0" react-dom: "^18.2.0"

any idea why I am getting this ?

[ArtyomVancyan]

Hi @FatiMooni. Thanks for reporting the issue. I was able to run with the exact provided versions of the packages and was not see any of the above errors. Please check the way you use it or provide the code from importing to the component usage, and we will check it together.

As you use the 5.x version of Ant Design, you are supposed to import the component in the following way:

import PhoneInput from "antd-phone-input";

[ArtyomVancyan]

@FatiMooni, also, what browser do you use? I have tested it on Chrome and Firefox, and it works.

[FatiMooni]

Hi @ArtyomVancyan , the bug appears occasionally , I couldn't find the exact steps to reproduce.

Here's how I am using it

// other importants
import PhoneInput from 'antd-phone-input';

// some code 

// component
  return (
       <Form layout="vertical" form={form}>

        <Form.Item
          label="Phone number"
          name={'mobileNumber'}
          rules={[
            {
              required: true,
              message: 'Please enter your Phone Number!',
            },
            () => ({
              validator(rule, value) {
                if (value && value.valid) {
                  return Promise.resolve();
                }

                return Promise.reject(
                  'The inserted phone number  is not valid !'
                );
              },
            }),
          ]}
        >
          <PhoneInput enableSearch />
        </Form.Item>
      // rest of code
      </Form>

  );
};

browser : Chrome

[ArtyomVancyan]

Hey @FatiMooni, thanks for providing your code. All you do is right. I just noticed that it happens occasionally. So I have fixed the only possible cause of that error. Please upgrade the antd-phone-input version to 0.1.5 and check again. Please verify that the error has gone.

[ArtyomVancyan]

I am sure it works fine now, so I am closing the issue. If you still see the above-described problem, please reopen this issue.