在腳手架當中我們總能看到 'vue$'配置了別名'vue/dist/vue.esm.js'alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src')}module: {rules: [
...(config.dev.useEslint ? [createLintingRule()] : []),
{ test: /\.vue$/, loader: 'vue-loader', options: vueLoaderConfig
}]}但是我們實際引用vue的時候都是 import Vue from 'vue'并沒有走這個別名而vue的npm包中的package.json 中 "main": "dist/vue.runtime.common.js", 默認是走vue.runtime.common.js所以問題來了 alias 中的 'vue$': 'vue/dist/vue.esm.js', 作用是什么呢？？？
1 回答
慕哥9229398
TA貢獻1877條經(jīng)驗 獲得超6個贊
resolve-alias
這個是 webpack.rosolve.alias 的文檔， vue$后面的 $代表精確匹配
運行時 + 編譯器 vs. 只包含運行時
這個 vue 文檔， 是為什么要寫 'vue$': 'vue/dist/vue.esm.js'，需要完整的含 編譯器 的 vue 版本時才寫
但是我們實際引用vue的時候都是 import Vue from 'vue'并沒有走這個別名
這個只要配置 alias, webpack 在尋找依賴的時候會判斷 是否別名，肯定會走 vue$ 的
module.rules的test: /\.vue$/,這個 $ 是正則的 $，跟 alias 的 $ 不是一回事
添加回答
舉報
0/150
提交
取消