import：
html檔案中，通過script標簽引入js檔案，
而vue中，通過import xxx from xxx路徑的方式匯入檔案，不光可以匯入js檔案，
“xxx”指的是為匯入的檔案起一個名稱，不是指匯入的檔案的名稱，相當于變數名，
“xxx路徑”指的是檔案的相對路徑.
src下有components,router檔案夾和App.vue檔案,components檔案夾下游apple.vue和banana.vue,router檔案夾下有index.js路由檔案
在路由index.js中，匯入apple.vue和banana.vue
import banana from '@/components/banana'
import apple from '../components/apple'
以上例子，通過兩種方式定義相對路徑，并且省略了檔案的后綴名，
.方式
以父子目錄的方式定義相對路徑
./指當前目錄
../指當前目錄的上一層目錄
@方式
以根目錄的方式定義相對路徑
vue在webpack.base.conf.js檔案中有如下配置
// 連接路徑并回傳
function resolve(dir) {
return path.join(__dirname, '..', dir)
}
module.exports = {
resolve: {
// 在匯入陳述句沒帶檔案后綴時，webpack會自動按照順序添加后綴名查找
extensions: ['.js', '.vue', '.json'],
// 配置別名
alias: {
'vue$': 'vue/dist/vue.esm.js',
// 將專案根目錄中，src的路徑配置為別名@
'@': resolve('src'),
}
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/31022.html
標籤：其他
上一篇：Vue之計算屬性Computed和屬性監聽Watch，Computed和Watch的區別
下一篇：webpack打包進行丑化壓縮遇到(TypeError Cannot read property 'compilation' of undefined)問題