Skip to content
本页目录

详解VUE中常用的几种import(模块、文件)引入方式_vue.js_脚本之家

1 引入第三方插件

javascript
import echarts from 'echarts'

2 引入工具类

第一种是引入单个方法

javascript
import {axiosfetch} from './util';

下面是写法,需要export导出

javascript
export function axiosfetch(options) {

}

第二种 导入成组的方法

javascript
import * as tools from './libs/tools'

其中tools.js中有多个export方法,把tools里所有export的方法导入

vue中怎么用呢?

javascript
Vue.prototype.$tools = tools

直接用 this.$tools.method调用就可以了

说到这 export 和 export default 又有什么区别呢?

下面看下区别

先是 export

javascript
import {axiosfetch} from './util';

如果是两个方法

javascript
import {axiosfetch,post} from './util';

再是 export default

javascript
import axiosfetch from './util';

3.导入 css文件

javascript
import 'iview/dist/styles/iview.css';

如果是在.vue文件中那么在外面套个style

vue
<style>

 @import './test.css';

</style>

4.导入组件

javascript
import name1 from './name1'

import name2 from './name2'

  components:{

     name1,

     name2,

  },