ES6 模块、VueJS 和 TypeScript

Question

我正在尝试创建一个简约的设置并希望使用上述功能。所以在我的 JavaScript 代码中我有一个：

<script type="module" src="./myapp.js"></script>

加载 myapp.js 模块。在 myapp.js 中，我想创建一个 Vue 组件。当然，我想用 TypeScript (myapp.ts) 编写这个组件并将其转换为 js。但是，要在 .ts 代码中获取 typeinfo，我必须像这样导入 Vue 类型：

import Vue from 'vue'

var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue!'
    }
});

当我转译此代码时，此代码以 es2015 模块语法维护（因为我的 tsconfig.settings），结果是此 javascript：

import Vue from 'vue';

var app = new Vue({
    el: '#app',
    data: {
      message: 'Hello Vue!'
    }
});

并且浏览器不接受这个命名导入。

问题是：（如何）我可以导入导出的类型而不使用上述语句导入它。我尝试了 /// 语法，但类型仍然不可用。这是因为类型是显式导出的，因此需要使用导入语法导入？

有没有办法在不导入的情况下获取类型？有没有办法使用命名导入来获取类型但排除该行进行编译？是否有其他方法可以实现这一点（无需 webpack 或其他设置）？

谢谢 约翰。

Answer 1

您可以通过加载带有脚本标签的vue.min.js 来创建一个最小的 Vue 应用程序。那你就不用import Vue了。

<script src="https://cdn.jsdelivr.net/npm/vue"></script>

然后你可以使用加载你的模块

<script type="module" src="mymodule.js"></script>
<script type="module" src="app.js"></script>

顺便说一句，这不是关于打字，而是关于导入允许您创建 Vue 组件的实际 Vue 代码。您根本不需要导入类型。