编写 TypeScript 并为浏览器和节点生成一个库

2024-03-01

我有一个在 Node.js 和浏览器中使用的内部库。它有许多文件,与 Grunt 任务和不同的序言连接在一起,一个用于浏览器,一个用于 Node:

browser:

// dependent 3rd-party libs like Mustache are already global
window.myLib = { /*just a namespace object filled with stuff later*/ }

// then comes the plain javascript which just adds elements to myLib.
// This part is identical to that used in Node
// example:
myLib.renderPartDetail = function (...) {...};

Node:

var Mustache = require('mustache');
var myLib = {};
module.exports = myLib;

// then comes the plain javascript which just adds elements to myLib.
// This part is identical to that used in Browser

这会产生 2 个不同的单输出 js 文件,一个用于浏览器,一个用于 Node。

我想要什么

  • 使用 TypeScript
  • 如果可能,浏览器和节点仅使用一种 CommonJS 语法(或 ES6 模块)
  • 投资于未来几个月内不会消亡的事物
  • 更加模块化(也许有人只需要库的一部分)

是什么让我困惑

我在 TypeScript 中发现了两种不同类型的模块处理:

import {a, b} from './x'

and

import c = require('./y')

我习惯了 Node 中的后者,但第一个看起来像 ES6(可能是未来)。

目前我使用tsc --module commonjs但这只是输出格式,对吗?还有--module system但我找不到此选项的文档,当我使用它时,编译器会抱怨export = ...不允许。

还没玩过browserify, tsify, watchify, jspm, 系统JS,webpack- 它太相似了,太多了,但我认为其中一个或几个工具可以为我完成工作。

当我require(<a node module living in node_modules>),tsc 找不到模块:“TS2307:找不到外部模块‘时刻’”。

具体问题

  • 我应该在代码中使用哪种模块语法才能最好地与 Node 和浏览器配合使用?
  • 哪个工具链可以解决我的需求?是否有示例项目或样板可供我复制? (我也对 Gulp 持开放态度,不必使用 Grunt)。
  • 目前支持哪些 TypeScript 和 Node 版本?我将 1.4 嵌入到 IntelliJ 中,当将 1.6.2 引用为外部时,我收到非常深刻的神秘错误消息,例如“TypeError:host.fileExists 不是函数”(没有找到任何对此有帮助的信息)。也许使用 Node v4.1.1 不是最佳选择?

很抱歉这篇文章如此复杂。如果有必要,请给我建议从哪里开始,或者什么是最重要的改变或开始。


我应该在代码中使用哪种模块语法才能最好地与 Node 和浏览器配合使用?

如果您的目标是es5然后两种语法都可以编译为实际上相同的东西。使用其中之一,并随意混合搭配。

哪个工具链可以解决我的需求?是否有示例项目或样板文件可供我复制

我使用(并推荐)webpack。您可以按原样使用 commonjs / nodejs,然后 webpack 可以为前端创建捆绑包。示例请参见https://github.com/basarat/tsb/tree/master https://github.com/basarat/tsb/tree/master

目前支持哪些 TypeScript 和 Node 版本?我将 1.4 嵌入到 IntelliJ 中,当将 1.6.2 引用为外部时,我收到非常深刻的神秘错误消息,例如“TypeError:host.fileExists 不是函数”(没有找到任何对此有帮助的信息)。也许使用 Node v4.1.1 不是最佳选择?

使用最新的 TypeScript(TypeStrong 的各种工具,例如atom-typescript/grunt-ts/ts-loader 支持)。您收到的错误是网络风暴错误,应该向他们报告。 (我使用原子打字稿)。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

编写 TypeScript 并为浏览器和节点生成一个库 的相关文章

  • HTML 和 标签有什么区别?

    HEAD 标签和 BODY 标签有什么区别 大多数 HTML 书籍仅 简短 提及 and 标签 但它们消失得很快 它们会影响浏览器呈现网页的方式吗 另外 它们会影响 javascript 的运行顺序吗 我的意思是 如果我里面有一个javas
  • 如何在 google.maps.event.addListener 中使用它

    以下示例有效 但是当我尝试传递参数并使用this在该功能不起作用 Working google maps event addListener markers i click showInfoWindow function showInfoW
  • 角度垫排序不适用于带点表示法的 matColumnDef

    我正在尝试按列对表进行排序 当我必须过滤另一个结果中的结果时 就会出现问题 我尝试通过括号表示法和点表示法访问该属性 但没有给出结果 还将最终节点放置在 matColumnDef 中 但失败 因为有 2 列同名 table table
  • “require(...)”是常见的 JavaScript 模式还是库函数?

    我通常发现这是 node js 脚本 模块以及 phantomJS casperJS 等中的第一行 我很好奇 这是否是服务器端 javascript SSJS 的常见模式 类似于 include在 C C 中或import在 Java 中
  • 如何在 JavaScript 中将变量的内容写入文件[重复]

    这个问题在这里已经有答案了 可能的重复 firefox 如何启用本地 JavaScript 来读取 写入我的 PC 上的文件 https stackoverflow com questions 2846045 firefox how to
  • 自调用函数未定义

    如果我声明一个函数文字 var x function alert hi console log x returns the function code However var x function alert hi console log
  • Rangy:插入符号下的单词(再次)

    我正在尝试创建一个预输入代码以添加到 wysihtml5 富文本编辑器 基本上 我需要能够插入人员 标签引用 例如 Twitter Github Facebook 我发现一些人试图实现同样的事情的代码 http jsfiddle net A
  • JSONP 使用 JQuery 从 HTTPS 协议获取 JSON

    我正在尝试获取从 https 安全站点发送的 JSON 客户端希望不要使用任何服务器端语言 全部都是 Javascript 我读到 当使用 Jquery 中的 ajax 函数时 我必须使用 JSONP 才能从安全站点加载 JSON 我的第一
  • 为现有模块创建 d.ts 文件

    我正在尝试创建一个d ts文件为React 静态容器 https github com reactjs react static container图书馆 NPM 中安装的库如下所示 var React require react var
  • 使用 Express.js 和 NodeJS,您可以通过响应正文中的重定向发送 JSON

    我正在尝试通过 302 重定向发送 JSON 在 ExpressJS 中这可能吗 API 声明可以添加主体res json 例如 res json 302 name larry 在接收端 重定向的目的地 主体是空的 这是一些示例代码 发送应
  • AngularStrap 工具提示禁用我的自定义指令

    我正在尝试让 bs tooltip AngularStrap 指令与我自己的名为 checkStrength 的自定义指令一起使用 该指令检查密码的强度 单独使用这些指令中的任何一个时 它们都可以正常工作 但不能一起工作 This http
  • 使 Bootstrap Popover 在悬停而不是单击时出现/消失

    我正在使用 Bootstrap 构建一个网站Popover http twitter github com bootstrap javascript html popovers我不知道如何使弹出窗口出现在悬停而不是单击时 我想做的就是当有人
  • for循环中需要声明变量吗?

    有什么区别 for var i 0 i lt 5 i for i 0 i lt 5 i 是否有必要包含 var 关键字 我知道 var 关键字会影响变量范围 但我无法理解是否有必要在 for 循环中包含该关键字 在第二个示例中 您的变量是全
  • 在 Nodejs 中,如何停止 FOR 循环直到 MongoDB 调用返回

    我正在研究下面的代码片段 我有一个名为 stuObjList 的 JSON 对象数组 我想循环遍历数组以查找具有特定标志集的特定 JSON 对象 然后进行数据库调用以检索更多数据 当然 FOR 循环不会等待数据库调用返回并到达 j leng
  • 在javascript中创建图像的缩略图方块(不丢失纵横比)

    我正在制作一个客户端拖放文件上传脚本作为书签 在上传之前 我使用 File API 将图像读取为 base64 格式并将其显示为缩略图 This is how my thumbnails look like I want them to l
  • 如何从除自身之外的其他(blazor)库引用js/css文件?

    我如何引用 使用位于引用的 blazor 项目中的 css cs 文件 该文件与 host cshtml 中的当前项目不同 我的意思是
  • 绘制多边形

    我正在使用 Google Maps API V3 根据路径绘制多边形 该路径是随机未排序坐标点 LatLng 的数组 这会产生以下形状 Polylines intersect Problem 由于多边形的形状取决于路径中点的顺序 因此如何对
  • 将 JSON 属性绑定到表单

    我有一个 JSON 对象和一个
  • Chrome 调试器注入 javascript

    我有这样的好奇心 是否可以以某种方式在我的页面中注入 javascript 并执行它并调试它 正如您在控制台中所做的那样 但在控制台中您无法暂停并观察变量 是否可以调试我通过控制台输入的代码 为什么无法调试通过 XHR 接收的代码 Than
  • 如何通过点击复制 folium 地图上的标记位置?

    I am able to print the location of a given marker on the map using folium plugins MousePosition class GeoMap def update

随机推荐