编写TypeScript并发出用于浏览器和节点的库 [英] Write TypeScript and emit a library for Browser and Node

问题描述

我有一个用于Node.js和浏览器的内部库。它有许多文件，并带有Grunt任务和不同的序言，一个用于浏览器，一个用于Node：

浏览器：

  //依赖的第三方（如Mustache）已经是全局
 window.myLib = {/ *只是稍后填充了内容的命名空间对象* /} 
 
 // //然后是普通的javascript，它仅向myLib添加元素。 
 //此部分与节点
中使用的示例相同：
 myLib.renderPartDetail = function（...）{...}; 
  

节点：

  var Mustache = require（'mustache'）; 
 var myLib = {}; 
 module.exports = myLib; 
 
 //然后是普通的javascript，它将元素添加到myLib中。 
 //这部分与浏览器
  

所用的相同输出js文件，一个用于浏览器，一个用于Node。

我想要的东西

• 使用TypeScript


• 如果可能，对浏览器和节点仅使用一种CommonJS语法（或ES6模块）


• 在接下来的几个月中投资一些不会消失的东西


• 模块化程度更高（也许有人只需要一部分lib）

什么让我感到困惑

我在TypeScript中发现了两种不同的模块处理方式： / p>

 从'./x'
   
 
 
 and 
  import c = require（'./ y'） 
  
我已经习惯了node中的后者，但是第一个看起来像ES6（可能是
 
 
 
当前我使用的是 tsc --module commonjs ，但是这只是输出格式，对吗？还有-module system ，但是我找不到该选项的文档，当我使用它时，编译器会抱怨 export =.。 。
 
 
 
还没有玩过 browserify ， tsify ， watchify ， jspm ，SystemJS， webpack -太相似了，太多了，但是我认为其中一个或几个工具可以为我完成工作。
 
 
 
并且当我 require（<位于node_modules中的一个节点模块>）时，tsc找不到该模块： TS2307：找不到外部模块'moment'。
 
 
 
 具体问题 
 
 
 
 
 
我应该使用哪种模块语法在我的代码中最好地与Node and Browser一起使用？
 
 
哪个工具链可以解决我的要求？有可以从中复制的示例项目或样板吗？ （我也对Gulp开放，不必使用Grunt。）
 
 
当前支持哪种TypeScript和Node版本？我在IntelliJ中嵌入了1.4，当将1.6.2称为外部时，我收到了很深的隐秘错误消息，例如 TypeError：host.fileExists不是一个函数（对此没有任何帮助）。也许使用Node v4.1.1并不是最佳选择？
 
 
 
 
 
对不起，这篇文章如此复杂。如有必要，请给我建议从哪里开始，或者什么是最重要的更改或开始。 
解决方案
 
 
 
我应该在代码中使用哪种模块语法来最好地使用Node和Browser？ / p> 
 
如果您要定位 es5 ，则两种语法都可以有效地编译为同一件事。 
 
 
哪个工具链可以满足我的要求？是否有示例项目或样板文件，可以在其中复制我使用（并推荐）webpack的
 
 
您可以按原样使用commonjs / nodejs，然后webpack可以为前端创建捆绑包。有关示例，请参见 https://github.com/basarat/tsb/tree/master  
 
 
当前支持哪种TypeScript和Node版本？我在IntelliJ中嵌入了1.4，当将1.6.2称为外部时，我收到了很深的隐秘错误消息，例如 TypeError：host.fileExists不是一个函数（对此没有任何帮助）。也许使用Node v4.1.1不是最佳选择？
 
 
使用最新的TypeScript（来自TypeStrong的各种工具，例如atom-typescript / grunt- ts / ts-loader支持）。您遇到的错误是网络风暴错误，应报告给他们。 （我使用的是原子打字稿）。
 
I have an internal library used in Node.js and browser. It has many files, concatenated with a Grunt task and different prologues, one for browser, one for 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
This results in 2 different single output js files, one for browser, one for Node.

What I'd like


use TypeScript
if possible, use only one CommonJS syntax (or ES6 modules) for both browser and node
invest in something not dying in the next couple of months
be a bit more modular (maybe somebody needs only part of the lib)


What confuses me

I find 2 different kinds of module handling in TypeScript:
import {a, b} from './x'
and
import c = require('./y')
I'm used to the latter from node, but the first looks like ES6 (which might be the future).

Currently I use tsc --module commonjs but this is only the output format, right? There is also --module system but I can't find documentation for this option and when I use it, the compiler complains about export = ... is not allowed.

Haven't yet played around with browserify, tsify, watchify, jspm, SystemJS, webpack - it's just too similar and too much, but I think one or a few of those tools could do the work for me.

And when I require(<a node module living in node_modules>), tsc cannot find the module: "TS2307: Cannot find external module 'moment'".

Concrete Questions


Which module syntax should I use in my code to best work with Node and Browser?
Which tool-chain will solve my requirements? Is there an example project or a boilerplate where I can copy from? (I'm open to Gulp as well, doesn't have to use Grunt).
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?


I'm sorry that this post is so complex. If necessary, just give me advise where to start or what is the most important thing to change or begin with. 
解决方案

  
Which module syntax should I use in my code to best work with Node and Browser?
If you are targetting es5 then both syntaxes compile down to effectively the same thing. Use either, and feel free to mix and match.

  
Which tool-chain will solve my requirements? Is there an example project or a boilerplate where I can copy from
I use (and recommend) webpack. You get to use commonjs / nodejs as it is and then webpack can create bundles for front end. For a sample see 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?
Use the latest TypeScript (various tools from TypeStrong e.g. atom-typescript/grunt-ts/ts-loader support that). The error you are getting is a webstorm error and should be reported to them. (I use atom-typescript).

                        
这篇关于编写TypeScript并发出用于浏览器和节点的库的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！