Question

我正在尝试按照此媒介教程：https://medium.com/@bryantheastronaut/react-getting-started-the-mern-stack-tutorial-feat-es6-de1a2886be50

其他试图遵循这一点的人评论说他们遇到了和我一样的问题，虽然在那个教程中还没有发现这个问题的解决方案，而SO上的类似问题与图像文件有关，答案是将特定文件移动到src目录。

问题是引用data.js文件，该文件位于顶层（与src目录相同的级别。

当我尝试将其合并到一个文件中时，如下所示：

/CommentBox.js
import React, { Component } from 'react';
import CommentList from './CommentList';
import CommentForm from './CommentForm';
import DATA from '../data';
import style from './style';
class CommentBox extends Component {
 constructor(props) {
 super(props);
 this.state = { data: [] };
 }
 render() {
 return (
 <div style={ style.commentBox }>
 <h2>Comments:</h2>
 <CommentList data={ DATA }/>
 <CommentForm />
 </div>
 )
 }
}
export default CommentBox;

出现以下结果的错误：

Failed to compile.
./src/CommentBox.js
Module not found: You attempted to import ../data which falls outside of the project src/ directory. Relative imports outside of src/ are not supported. You can either move it inside src/, or add a symlink to it from project's node_modules/.

此SO帖子有类似的问题：The create-react-app imports restriction outside of src directory，但解决方案是将图像文件移动到src目录。

有没有人想出如何链接到与反应文件中的src目录相同级别的文件？我不明白node_modules目录中的符号链接是什么意思，我找不到如何制作符号链接的教程。

Answer 1

我建议您只需将data.js文件放在src/目录中。这只是模拟数据，对吗？对于您的开发，它应该是src的一部分。只需这样做并完成教程。就这样。如果你真的在处理一个生产应用程序，你会弹出应用程序，以便在整个配置上拥有更大的灵活性，从而能够消除这种限制。

React - 从src目录外部导入文件

1 个答案: