我启动了Webstorm并设法在几分钟内完成了一个简单的Typescript项目.
然而,当我尝试为更大的项目设置一些结构和合理的工作流程时,我开始遇到似乎是疯狂的工具,经理,构建系统,每个都处于各种折旧状态.
我正在寻找简单可靠的方法:
>使用多个文件而无需手动包含脚本标记
>使用外部类型定义和JavaScript库并以合理的方式加载它们对于我自己的代码,似乎es6模块是我最好的选择,但由于某种原因,似乎我仍然需要使用第三方模块加载器?似乎有很多种可用 – commonjs,requirejs,systemjs,webpack.此外,虽然许多消息来源建议使用es6,但在大多数浏览器中仍然没有完全支持它,这意味着我需要进行转换.此外,在某些地方有一个使用gulp / grunt的构建过程,我甚至不知道我是否需要使用!
我完全不确定如何处理外部模块.我试过Bower,但似乎我还需要手动为所有外部库包含标签(这不是一个大问题,但我确信有更好的方法!)
这真的是我正在经历所有这一切的普遍感觉 – 当然还有一种更好的做事方式.但是,涉及过时信息的山脉,意味着我找不到任何可靠的东西.
所以 – 前端专家 – 你会建议一个完整的新手作为当今世界的Typescript(甚至只是Javascript)开发的良好工作流程?
I’m after a way to simply and reliably:
- Use multiple files without manually including script tags
- Use external type definitions and javascript libraries and load them in a sensible way
最简单的方法:just use Webpack.
对于整个图片,您可以选择:捆绑包Webpack,Browserify,Rollup.使用这些解决方案,在代码中的每次修改之后,使用所有JS代码重新构建捆绑包.或者使用JSPM进行捆绑的异步装载程序SystemJS(here is a tutorial),或RequireJS.
请注意,通过在TypeScript代码中使用ES6语法导入/导出,加载器的选择并不意味着TypeScript代码的主要区别.在TS模块选项的帮助下,可以将相同的代码编译为不同的格式.
For my own code, it seems like es6 modules are my best bet, but for some reason it seems like I still need to use a third party module loader?
你是对的.
阅读the article from Mozilla:
What does
import
actually do?Would you believe… nothing? […]
ES6 leaves the details of module loading entirely 07008.
还有一个未完成的程序化API.另见the book of Dr. Axel Rauschmayer:
The module loader API is work in progress
As you can see in 070010, the module loader API is still work in progress.
关于捆绑的必要性,我建议this article.
但是今天,使用TypeScript和加载器,您将能够轻松地在大型前端项目上使用标准语法导入/导出.
…
Also, although numerous sources are recommending using es6, it’s still not fully supported in the majority of browsers, meaning I need to get transpilation going as well.
仍然需要了解目标浏览器的差异.但是对于可以进行polyfilled的新API,es6-shim可以打包应用程序的代码.
精彩评论