【JS】import 、import() 与 @import 的区别

import 、import() 与 @import 的区别

import xx from '...' 是一种导入方式，是es6模块化的新语法，必须要写到js文件的最上面；

import('...') 是 import() 函数，主要作用是实现动态加载模块，可以写到任意位置，代码运行到该语句才会加载该模块，它返回一个promise对象；

// 默认导入 导入的变量名是 myModule
import('./myModule.js').then(myModule=> {
    console.log(myModule);
});
​
// 或者是在vue-router中引入路由组件（非常好用！）
routes= [
    {
        path: '/404',
        component: () =>import('@/views/404'),
    }
]

@import 'xxx' 是css的语法，虽然和 import长得很像，但是它们之间没有任何关系，通过@import 可以在一个css文件中引入另一个css文件(比如字体图标)

@import'./icon.less';  // 必须要写分号！！！