Error on build

[Victor K Varghese]

Hi,

i'm getting this error when i'm trying to build.

 <Files
        className="files-drop-zone"
        onChange={onChange}
        onError={err => {
          // eslint-disable-next-line no-console
          console.log('onError', err);
        }}
        accepts={['image/png', 'image/jpeg', '.pdf', '.csv', 'application/*']}
        multiple
        maxFiles={3}
        maxFileSize={1000000}
        minFileSize={0}
        clickable
      >
        <div className="drop-zone">
          <div className="browse-row">
            <SmallBodyFont color="#707070">Drop files here to upload or </SmallBodyFont>
            <Button variant="outlined" className="browse-btn">
              <MicroBodyFont color="#009AD9">Browse</MicroBodyFont>
            </Button>
          </div>
        </div>

        {files.length > 0 && (
          <>
            <Divider className="divider" />
            <div className="file-list">
              {files.map(file => (
                <FileItem key={file.id} file={file} />
              ))}
            </div>
          </>
        )}
      </Files>

**There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:

• project/node_modules/babel-loader/lib/index.js?{"extends":"/project/.babelrc"}!/project/node_modules/React/index.js
  Used by 1 module(s), i. e.
  /project/node_modules/babel-loader/lib/index.js?{"extends":"/project/.babelrc"}!/project/node_modules/react-files/dist/index.js**

the error goes away when i remove the imports related to react-files.

My project uses web pack to build

Can someone help?

[Ajay Sabhaney]

Which versions of react and react-files are you using?

[Victor K Varghese]

"react": "16.13.0",
"react-files": "^3.0.0-alpha.3",

[Ajay Sabhaney]

These versions are supported by this library, looks like it's likely an issue with your code or the webpack config. Have you tried the solution outlined here?
https://stackoverflow.com/questions/47534267/webpack-there-are-multiple-modules-with-names-that-only-differ-in-casing-but

ie. Can you confirm you're doing:

import React, { Component } from 'react'

and not

import React, { Component } from 'React'

[Victor K Varghese]

@asabhaney yeah i checked, no wrong imports

do i need to do something on web pack for this library ?

[Victor K Varghese]

@asabhaney I tried copy pasting index.js file inside my project and changed imports

it is working if the file is inside my project, but fails when i use import Files from 'react-files'