个人中心
文章发布
退出
作者热门文章
- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用？
- database - RESTful URI 是否应该公开数据库主键？
25
4
我想用 es6 模块组织我的 typescript 代码，并直接在浏览器中通过脚本 type="module"加载它们。我已经检查了支持 ( https://caniuse.com/#feat=es6-module )，它会起作用。我使用 chrome 版本 66。
我尝试过但没有成功(见下面的代码)，而且我对正确使用策略感到困惑。
解决方案一:在app.ts文件中，是否应该导入外部模块，然后如何加载正确的js文件？
解决方案 2:在 app.ts 文件中，我应该直接导入 .js 代码但如何引用 .d.ts 文件以进行类型检查？
任何帮助将不胜感激。
============================================= ========================
这是我试过的代码
我的 index.html 文件
<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
<title>Welcome</title>
</head>
<body>
<div id="app">
<img src="https://vuejs.org/images/logo.png" alt="Vue logo">
<h1>{{ msg }}</h1>
</div>
<script type="module" src="app.js"></script>
</body>
</html>
我的 app.ts 文件
//Solution 1
// import Vue from "vue"; // Uncaught TypeError: Failed to resolve module specifier "vue". Relative references must start with either "/", "./", or "../".
//Solution 2
import Vue from "./Vendors/vue.esm.browser.js"; // It works in the browser but i have lost the definition inside Typescript file
var app = new Vue({
el: '#app',
data: {
msg: 'hello :)!'
}
});
我的 tsconfig.json 文件
// tsconfig.json
{
"compilerOptions": {
"strict": true,
"target": "es6",
"module": "es6",
"moduleResolution": "node",
"allowJs": true
}
}
我的 package.json 文件
{
"name": "vuejsbrowseresmodule",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"vue": "^2.5.16"
}
}
最佳答案
经过几天的研究，我找到了答案。目前，不使用模块加载器就无法使用 typescript 。在 typescript 中有很多关于浏览器中的 native 加载器的讨论。
这里有更多信息=>
https://github.com/Microsoft/TypeScript/issues/16577 https://github.com/Microsoft/TypeScript/issues/13422
一个有趣的提案草案已经开始，可以在这里找到 =>
关于typescript - 混淆 : how to use es6 browser module withTypescript (without module bundler)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/50333892/
25
4
0
我在优化 JOIN 以使用复合索引时遇到问题。我的查询是: SELECT p1.id, p1.category_id, p1.tag_id, i.rating FROM products p1
我有一个简单的 SQL 查询，我正在尝试对其进行优化以删除“使用位置；使用临时；使用文件排序”。 这是表格: CREATE TABLE `special_offers` ( `so_id` int
我有一个具有以下结构的应用程序表 app_id VARCHAR(32) NOT NULL, dormant VARCHAR(6) NOT NULL, user_id INT(10) NOT NULL
此查询的正确索引是什么。 我尝试为此查询提供不同的索引组合，但它仍在使用临时文件、文件排序等。 总表数据 - 7,60,346 产品= '连衣裙' - 总行数 = 122 554 CREATE TAB
为什么额外的是“使用where;使用索引”而不是“使用索引”。 CREATE TABLE `pre_count` ( `count_id`
我有一个包含大量记录的数据库，当我使用以下 SQL 加载页面时，速度非常慢。 SELECT goal.title, max(updates.date_updated) as update_sort F
我想知道 Using index condition 和 Using where 之间的区别；使用索引。我认为这两种方法都使用索引来获取第一个结果记录集，并使用 WHERE 条件进行过滤。 Q1。有什
I am using TypeScript 5.2 version, I have following setup:我使用的是TypeScript 5.2版本，我有以下设置： { "
I am using TypeScript 5.2 version, I have following setup:我使用的是TypeScript 5.2版本，我有以下设置： { "
I am using TypeScript 5.2 version, I have following setup:我使用的是TypeScript 5.2版本，我有以下设置： { "
mysql Ver 14.14 Distrib 5.1.58，用于使用 readline 5.1 的 redhat-linux-gnu (x86_64) 我正在接手一个旧项目。我被要求加快速度。我通过
在过去 10 多年左右的时间里，我一直打开数据库 (mysql) 的连接并保持打开状态，直到应用程序关闭。所有查询都在连接上执行。 现在，当我在 Servicestack 网页上看到示例时，我总是看到
我使用 MySQL 为我的站点构建了一个自定义论坛。列表页面本质上是一个包含以下列的表格:主题、上次更新和# Replies。 数据库表有以下列: id name body date topic_id
在mysql中解释的额外字段中你可以得到: 使用索引 使用where;使用索引 两者有什么区别？ 为了更好地解释我的问题，我将使用下表: CREATE TABLE `test` ( `id` bi
我经常看到人们在其Haxe代码中使用关键字using。它似乎在import语句之后。 例如，我发现这是一个代码片段: import haxe.macro.Context; import haxe.ma
这个问题在这里已经有了答案: "reduce" or "apply" using logical functions in Clojure (2 个答案) 关闭 8 年前。 “and”似乎是一个宏，
这个问题在这里已经有了答案: "reduce" or "apply" using logical functions in Clojure (2 个答案) 关闭 8 年前。 “and”似乎是一个宏，
我正在考虑在我的应用程序中使用注册表模式来存储指向某些应用程序窗口和 Pane 的弱指针。应用程序的一般结构如下所示。 该应用程序有一个 MainFrame 顶层窗口，其中有几个子 Pane 。可以有
奇怪的是：。似乎a是b或多或少被定义为id(A)==id(B)。用这种方式制造错误很容易：。有些名字出人意料地出现在Else块中。解决方法很简单，我们应该使用ext==‘.mp3’，但是如果ext表面
我遇到了一个我似乎无法解决的 MySQL 问题。为了能够快速执行用于报告目的的 GROUP BY 查询，我已经将几个表非规范化为以下内容(该表由其他表上的触发器维护，我已经同意了与此): DROP T
我是一名优秀的程序员,十分优秀！