javascript - 编写 TypeScript 并为浏览器和 Node 生成一个库

Question

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

浏览器:

// 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
• 如果可能，对浏览器和 Node 只使用一种 CommonJS 语法(或 ES6 模块)
• 投资于 future 几个月内不会消亡的事物
• 更加模块化(也许有人只需要库的一部分)

是什么让我感到困惑

我在 TypeScript 中发现了 2 种不同的模块处理方式:

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

和

import c = require('./y')

我习惯了来自 node 的后者，但第一个看起来像 ES6(可能是 future )。

目前我使用tsc --module commonjs但这只是输出格式，对吧？还有--module system但是我找不到这个选项的文档，当我使用它时，编译器提示 export = ...不允许。

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

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

具体问题

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

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

Answer 1

Which module syntax should I use in my code to best work with Node and Browser?

如果您的目标是 es5，那么两种语法都可以有效地编译成相同的东西。使用其中任何一种，并随意混合搭配。

Which tool-chain will solve my requirements? Is there an example project or a boilerplate where I can copy from

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

Which TypeScript and Node versions are currently supported? I'm having 1.4 embedded in IntelliJ, when referencing 1.6.2 as external I'm getting very deep cryptic error messages like "TypeError: host.fileExists is not a function" (not finding anything helpful about this). Maybe it's not optimal to use Node v4.1.1?

使用最新的 TypeScript(来自 TypeStrong 的各种工具，例如 atom-typescript/grunt-ts/ts-loader 支持)。您得到的错误是一个 webstorm 错误，应该报告给他们。 (我使用 atom-typescript)。