在混合 ES/TS 项目中使用 Vue 组件

Question

我希望能够对 JavaScript 和 TypeScript 使用 Vue 文件，因此在<script>标记中何时lang未设置或设置为js使用 ES2015 以及何时<script lang="ts">使用 TypeScript。我有一个现有的 vue+ts 项目，现在我们决定要在用 ES6 编写的vue-paper-dashboard之上构建应用程序。我仍然想将我的组件保留在 TS 和.vue文件中<script lang="ts">。所以从空的仪表板项目开始，并用 TS/TSLint 替换了 Babel/ESLint。项目仍然可以正常加载：vue-paper-dashboard-typescript，但是，在.vue我设置的任何文件中，<script lang="ts">我都会收到如下错误：

Module build failed: Error: Could not find file: 'src/components/Dashboard/Views/Overview.vue'.

我已经将--allowJs编译器选项设置为 true。我也试着从改变入口文件main.js来main.ts，用来entryFileIsJs: true为TS-装载机，都无济于事。如何让 vue 单文件组件在混合 ES/TS 项目中工作？

谢谢！

Answer 1

我想我找到了解决办法。由于某种原因，我第二次尝试将入口点从 更改为 并在 ts 文件中进行必要的修复以进行编译时，它起作用main.js了main.ts。

我这里有一个工作示例：vue-paper-dashboard-typescript

更新： Creative-Tim 现在提供Vue Paper Dashboard 2 Pro（非免费），它使用支持 TypeScript 的 CLI 3。使用以下命令将 TS 支持添加到项目中vue add @vue/typescript：