如何将 Vuejs 与带有 Webpack 的模板编译器一起使用答案

【问题标题】：How to use Vuejs with template compiler with Webpack如何将 Vuejs 与带有 Webpack 的模板编译器一起使用
【发布时间】：2020-04-07 20:58:49
【问题描述】：

我正在使用 Webpack。

我大致按照本教程将 Vuejs 配置到我的构建中：https://medium.com/js-dojo/how-to-configure-webpack-4-with-vuejs-a-complete-guide-209e943c4772

我能够让它工作，但是当我尝试渲染一个模板时，我得到了一个错误（在浏览器中）：“你正在使用模板编译器不可用的 Vue 的仅运行时构建。 ”。

node_modules 下的实际 Vuejs 安装有几个变体，包括带有编译器的完整包，这正是我想要的。

但是，Webpack 决定包含运行时版本。

我又摸索了一些，发现如果我修改node_modules/vue/package.json，并将其main 键从dist/vue.runtime.common.js 更改为dist/vue.common.js，并将其module 键从dist/vue.runtime.esm.js 更改为dist/vue.esm.js - Webpack 可以选择完整版。

我正在寻找一种在不改变 Vue 自己的 package.json 的情况下获得这种效果的方法。我找到了这个：How do I override nested NPM dependency versions?，并尝试了接受的答案，但似乎没有任何效果。

谁能告诉我实现目标的“正确方法”，即让 Webpack 包含完整版本的 Vuejs，而不仅仅是运行时？

【问题讨论】：

这就是你要找的答案：vuejs.org/v2/guide/…
@EricDay 谢谢，它成功了！如果您将其发布为答案，我将接受它为正确的。谢谢！

标签： vue.js npm webpack package.json

【解决方案1】：

您正在寻找的答案包含在 Vue 的安装中：

https://vuejs.org/v2/guide/installation.html#Explanation-of-Different-Builds

在 NPM 包的 dist/ 目录中，你会发现许多不同的 Vue.j 构建...

运行时：负责创建 Vue 实例、渲染和修补虚拟 DOM 等的代码。基本上所有东西都减去了编译器......

运行时 + 编译器与仅运行时如果您需要在客户端编译模板（例如，将字符串传递给模板选项，或使用其 in-DOM HTML 作为模板安装到元素），您将需要编译器，因此需要完整的构建

【讨论】：