vue中import xxx from 和 import {xxx} from

1、import 的作用：

导入另一个模块所做出的绑定。

无论是否声明了 strict mode ，导入的模块都运行在严格模式下。

2、形式：

import name from ''

name参数是“导入模块对象”的名称。

3、四种使用方法：

第1种

import x from 'abc.js'

这种导入要求 abc.js 模块中有 export default 默认导出，x 作为消费者导入 abc.js 模块默认导出的名称，x 可以随意更换为你喜欢的名字

第2种

import { y } from 'abc.js'

这种导入要求 abc.js 模块中必需有 export y 命名导出，y 是消费者要从 abc.js 模块导入的命名元素，y 不可更换为其他名称。如果你实在是感觉x不顺眼，那可以采用下面的方式对 y 重命名

第3种

import { y as xxx } from 'abc.js'

此处 xxx 就是重命名的新名称

第4种

import x, { y } from 'abc.js'

这种导入要求 abc.js 模块中有 export default 默认导出并且有 export y 的命名导出

4、vue中import xxx from 和 import {xxx} from的区别

1）import xxx from，在Element-UI中被称为整体引入，一般是对一个整体对象进行引入的，如：

    import FunName from ‘../xxx’

2）import {xxx} from，在Element-UI中被称为按需引入 ，一般是对一个对整体对象进行解构，引入整体对象内的单个对象，如：

import {xxx} from ‘../xxx’

export 和 export default两个导出的区别：

        1、export与export default均可用于导出常量、函数、文件、模块等

        2、在一个文件或模块中，export、import可以有多个，export default仅有一个

        3、通过export方式导出，在导入时要加{ }，export default则不需要

         4、 注意： export能直接导出变量表达式，export default不行。

参考链接：js import的4种用法一定要知晓丨技术开发分享录vue中import xxx from 和 import {xxx} from的区别 - 简书