vue中import與export注意點

2021-09-28 15:04:32 字數 1861 閱讀 6834

1、引入第三方外掛程式

import axios from 'axios
2、引入工具類或js檔案

第一種是引入單個方法

import


from


'./util'


;
下面是寫法，需要export匯出

export


function


axiosfetch


(options)
第二種 匯入成組的方法

import


*as tools from


'./libs/tools'
其中tools.js中有多個export方法,把tools裡所有export的方法匯入

vue中怎麼用呢？

vue.prototype.too

ls=t

ools

直接用t

his.

tools = tools 直接用 this.

tools=

tool

s直接用

this

.tools.method呼叫就可以了

export 和 export default的區別


1.export


import from './util'; //需要加花括號 可以一次匯入乙個也可以一次匯入多個，但都要加括號


如果是兩個方法


import from './util'; 


2.export default 


import axiosfetch from './util'; //不需要加花括號 只能乙個乙個匯入


*export default有單次限制，只能使用export default向外暴露一次*
3、匯入 css檔案

import 'ant-design-vue/dist/antd.css'
如果是在.vue檔案中那麼在外面套個style

4、匯入元件

import groupsecond from


'./second'


;
vue使用import … from …來匯入元件，庫，變數等，而from後的**可以是js，vue，json，可在webpack.base.conf.js（vue-cli2）或者webstorm.config.js（vue-cli@3）中配置from後可匯入的檔案型別。

module.exports =


}...


}
1.extensions指定了from後可匯入的檔案型別。

2.js和vue是可以省略字尾的，json不可以省略字尾。

3.test.vue，test.js同時存在於同乙個資料夾下，則import的匯入優先順序是：js>vue

from後的**除了檔案，還可以是資料夾

if


(package


.json存在 &&


package


.main欄位存在 &&


package


.main指定的js存在)


else


if(index.js存在)


else
from的**是資料夾，那麼在package.json存在且設定正確的情況下，會預設載入package.json；若不滿足，則載入index.js；若不滿足，則載入index.vue。

參考

1、

vue之require與import之間的區別

首先我們要明白require與import的基本語法 require的基本語法 在匯出的檔案中定義module.export,匯出的物件的型別不予限定 可以是任何型別，字串，變數，物件，方法 在引入的檔案中呼叫require 方法引入物件即可，換一種說法就是require相當於module.expo...

vue之require與import之間的區別

首先我們要明白require與import的基本語法 require的基本語法 在匯出的檔案中定義module.export,匯出的物件的型別不予限定 可以是任何型別，字串，變數，物件，方法 在引入的檔案中呼叫require 方法引入物件即可，換一種說法就是require相當於module.expo...

import與 import的使用

在xcode 5 下，為了更易於專案開發，增加了modules和 auto linking 這兩個新特性。用 import 來增加框架專案中比用 import會更有效.modules and auto linking 預設情況下是enabled的。如果是舊的專案，你可以通過設定 language m...