Module not found: Can't resolve

Question

I'm developing a component with React.js and the console is throwing the following error:

Failed to compile:

./src/components/file_tree.js
   Module not found: Can't resolve '.src/components/directory.js' in 
'D:\Treebeard\src'

Here you can see the code inside file_tree.js:

import React from 'react';
import ReactDOM from 'react';
import { Directory } from './components/directory.js';

The code inside directory.js:

import React from 'react';
import { TriangleDown } from './components/file_tree.js';
import { FolderIcon } from './components/file_tree.js';
import { formatName } from './components/file_tree.js';
import { renderTree } from './components/file_tree.js';

And here, the App.js code, just in case:

import React from 'react';
import ReactDOM from 'react-dom';
import { SearchEngine } from './components/search_engine.js';
import { FileTree } from './components/file_tree.js';
import { Directory } from './components/directory.js';

I checked the file paths from both files and everything seems okay, but this error is thrown. Am I missing something about the file paths? Both directory.js and file_tree.js are inside './src/components' folder.

App.js is inside './src' folder.

@Maxwelll shouldn't matter at this point, you'd get a different error if it didn't actually export those. — Jared Smith
– Jared Smith, Commented Apr 20, 2018 at 14:23
@JaredSmith if you are by default exporting the component it would matter... — Maxwelll
– Maxwelll, Commented Apr 20, 2018 at 14:25
@Maxwelll you and I are working off two different definitions of "matter". You seem to mean "necessary to make the code work" and I mean "would produce the specific error the OP is asking about". AFAICT, we're both correct. — Jared Smith
– Jared Smith, Commented Apr 20, 2018 at 14:28

Bhojendra Rauniyar · Accepted Answer · 2018-04-20 14:29:20Z

1

Since you are accessing file path from same directory. It should be:

file_tree.js:

import React from 'react';
import ReactDOM from 'react';
import { Directory } from './directory.js';

directory.js:

import React from 'react';
import { TriangleDown } from './file_tree.js';
import { FolderIcon } from './file_tree.js';
import { formatName } from './file_tree.js';
import { renderTree } from './file_tree.js';

App.js: It's okay. Since you're accessing components file path from the current directory.

import React from 'react';
import ReactDOM from 'react-dom';
import { SearchEngine } from './components/search_engine.js';
import { FileTree } from './components/file_tree.js';
import { Directory } from './components/directory.js';

For further help, see this post which will help you in relevant case.

edited Apr 20, 2018 at 14:29

answered Apr 20, 2018 at 14:23

Bhojendra Rauniyar

86k36 gold badges179 silver badges241 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Module not found: Can't resolve

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related