组件的引用

Question

代码中引入Todo 直接写的是 import Todo from './containers/Todo'; 但是实际上Todo组件是定义在./containers/Todo/index.jsx中,为什么能省略掉index，如果containers/Todo下除了Todo组件还有其他组件，比如Todo文件夹下有个subpage文件夹定义了个List文件夹，List文件夹下有个文件叫list.jsx,里面定义为List组件 要怎么引用？并且为什么例子里的组件定义都是叫index.jsx,只是在不同的路径下，为什么不是什么组件就叫什么名字呢。

Answer 1

双越 2017-05-03 13:18:29

这个我在教程中强调过，组件不是一个简单的 jsx 文件，可能是好几个文件的组合方式，index.jsx只是组件的一个引用入口而已。

另外，webpack会自动为你不全 index.jsx ，因此在引用时不用写。当然，写上也没有问题。

• 提问者 新童 #1

  webpack.config里只定义了app/index.jsx为入口文件，为什么其他路径下的index.jsx是组件的引用入口？是在哪里设置的

• 双越 回复 提问者 新童 #2

  resolve:{ extensions:['', '.js','.jsx']},  至于 index 这个文件名，webpack会自动去寻找