Import的问题

#1
import Home from "./containers/Home/index.jsx

这样引用是可以的,但是

import Home from "./containers/Home/index"
import Home from "./containers/Home"

这两种种写法都不行,这是为什么,
如果把 index.jsx 改成 index.js

import Home from "./containers/Home"
import Home from "./containers/Home/index"
import Home from "./containers/Home/index.js"

这三种都是可以的,
求解。
(已经在webpack里配置了jsx和js test: / \ .(jsx|js) $/,)

#2

打开你的package.json文件,里面有个main属性,写的是啥就代表import文件夹时候的默认文件是啥

#3

test: / \ .(jsx|js) $/,)是你配置的babel-loader的正则,而不是你import解析可以省略后缀

省略后缀应该用如下的属性

因为该属性默如下,也就是后缀为.js或者.json可以不写:

extensions: [".js", ".json"]

那你想要省略jsx后缀就这样喽

        resolve: {
            extensions: [
                ".js",
                ".json",
                ".jsx"
            ],
        }

建议多在webpack官网看看各个配置的用法

1 Like
#4

谢谢老哥,以前没配置过webpack :kissing_heart: