0

问题描述

我最近写了一个vue组件,我在index.js中即使用了export default,又使用了export{},源码点这里

图片描述

打包以后,无法直接引入
import { EasyGoTop, easyGoTopMixin } from 'easy-go-top'

但是直接import { EasyGoTop, easyGoTopMixin } from 'easy-go-top/src/index'是可以的

按道理他们应该是一样的结果,但是第一种不行,所以我猜测是和打包有关,但是不能确定,所以想请教一下各位大神

注意:package.json 里面 添加了 "main": "dist/easy-go-top.umd.min.js", 指向的是打包后的文件,因为要兼容到浏览器端,所以用的umd

2019-05-13 提问
3 个回答
0

没有看清楚问题,楼下的答案是正确的,在package中添加 main:'index.js'

下面内容可能解释原因:

1 查找模块:

如果这种声明引入模块 import foo from 'foo' 会查找以下路径:
./node_modules/foo
../node_modules/foo
../../node_modules/foo
直到文件系统的根目录

2.相对路径模块

import foo from './foo' 在当前文件夹下查找foo 文件
import bar from '../bar' 在上个文件夹中查找bar
import bar from '../someFolder/bar'

3.查找文件:

当找到文件的位置,接下来是查找文件,比如 foo
如果 foo.js 存在 ,成功,停止
如果 foo 是一个文件夹,有一个foo/index.js 存在,成功
如果package.json 声明main 键值存在,成功。

0

如果你想第一种写法,修改package.json 的 main字段为

"main": "./src/index.js",
0

一个组件只能有一个 export default ,export default可以用第一种方式导入;
一个组件可以有多个export , export导入用相对路径导入。

撰写答案

推广链接