vue中import动态导入后面的@什么意思?

export 和 export default 的区别如果是 export 导出的文件,在导入时可以一次导入一个,也可以导入多个,但必须加上花括号!import {add} from './math'
import {add, sub} from './math'
如果是 export default 导出的文件,只能一个一个的导入,且不需要加上花括号。一个模块中只能有一个export default默认输出import add from './math'
import sub from './math'
在.vue文件中导入,那么是在vue组件的style里面导入,且import前面需要加@符号<style>
  @import 'iview/dist/styles/iview.css';
</style>
vue文件引入js文件import a from '…/a'
import '…/a'
js中引入(调用)其他js文件import {firstName, lastName} from './test.js'; // 导入外部的变量或函数等
导入 css 文件import 'iview/dist/styles/iview.css';
导入函数、字符串、数字、类let aa = 'aaaaaaa',
bb = ( () => {
return '这是函数bbbbb'
})
export {aa,bb};
import {aa,bb} from "js文件的路径";
import {aa} from "js文件的路径";
import {bb} from "js文件的路径";
导入整个模块该js文件导出不止一个函数export const sqrt = Math.sqrt;
export function square(x) {
return x * x;
}
export function diag(x, y) {
return sqrt(square(x) + square(y));
}
文件里所有exports的方法都导入:import * as tools from "js文件的路径"
使用时tools.sqrt、tools.square()导入组件import name1 from './name1'
import name2 from './name2'
components:{
name1,
name2,
}
导入外部组件// 引入全部组件
import Vue from 'vue'
import Router from 'vue-router'
// vue-router是Vue.js官方的路由插件
import Mint from 'mint-ui'
// Mint UI 是一个基于Vue.js 的移动端组件库。
Vue.use(Router)
Vue.use(Mint)
// 按需引入部分组件
import {Cell, Checklist} from 'mint-ui'
Vue.component(Cell.name, Cell)
Vue.component(Checklist.name, Checklist)
Vue中的import中@的作用是路径别名,在配置文件webpack.base.config中module.exports = {
configureWebpack: {
name: name,
resolve: {
alias: {
'@': resolve('src')
//'@config': resolve('config'),
//'vue$': 'vue/dist/vue.common.js',
//'@components':path.join(__dirname, '..', 'src/components')//自定义组件路径
}
},
}
}

我要回帖

更多关于 vue中import动态导入 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信