vue-cli中 'vue$'配置的别名问题

在脚手架当中我们总能看到 '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', 作用是什么呢???


红颜莎娜
浏览 497回答 1
1回答

慕哥9229398

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 的 $ 不是一回事
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

Vue.js