Typescript Express项目中的客户端Javascript
我一直想知道如何在我的快递项目中正确添加客户端JavaScript。 我使用Typescript，我也想利用Typescript typings（例如jquery）编写我的clientside javascripts时。
我的项目结构如下所示：
- 根
- DIST
- SRC
- 助手
- 楷模
- 注册
- router.ts
- form.pug
- 轮廓
- router.ts
- profile.pug
- wwwroot文件
- CSS
- JS
- 图片
我到今天为止所做的：
我在wwwroot/js （例如jquery.min.js，registration-form.js）中创build了所有的客户端JavaScript文件，并将它们加载到相应页面的头部。
缺点：
- 我不得不写我们想支持的浏览器兼容的ES5 JavaScript
- 我不能把他们在逻辑上属于的JavaScript文件（例如，我宁愿把我的
registration-form.js到src/registration/而不是wwwroot） - 没有Typescript可能:(没有打字稿，没有转录到ES5等
在一些教程中，我看到他们只是运行npm install --save jquery并将其导入到他们的客户端文件中。 所以我觉得我一定错过了一些非常重要的东西，但我找不到任何教程。
我的问题：
在Typescript / Express应用程序中编写客户端JavaScript的“正确方法/最佳实践”（这也应该消除所提到的缺点）是什么？
在客户端使用TypeScript与服务器端没有多大区别。
以下是你可以做的事情：
- 为客户端打字稿源创build
client文件夹 - 将
tsconfig.json放入client文件夹并将其configuration为生成“es5”代码（目标：es5） - 安装jquerytypes（npm install –save-dev @ types / jquery）
就是这样，现在你可以在TypeScript中编写你的客户端代码。
现在，您可以使用tsc -p ./src ./src（src下的服务器端tsconfig.json）编译服务器端代码，并使用tsc -p ./client编译客户端代码。
我做了一个这样的应用程序的简单例子， 在这里检查 。 我把简单的脚本构build到package.json中，所以你可以运行npm run-script complie来将服务器和客户端代码都编译到/dist文件夹中。 然后用npm start运行它。
其他步骤：
- 自动化您的stream程：您应该能够在本地启动您的应用程序，然后只需编辑源代码TypeScript文件，应用程序应自动重新加载。 这可以使用webpack / gulp / grunt或自定义shell脚本来完成，一旦你的源文件被更改并保存，就可以触发它。
- 如果你发现自己编写了大量的客户端代码，请检查angular（ https://angular.io/docs ）。 它使用TypeScript作为客户端开发的首选语言，您将能够使用它构buildfunction更强大的客户端应用程序。 你也可以select另一个库（react，vue.js等），参见TypeScript站点上的例子 。
客户端Typescript与express无关。
Express仅用于服务器端（即使你使用电子，它仍然是服务器，而不是客户端），它并不关心客户端代码。
无论您使用哪种客户端框架 – 将express文件设置为静态文件，或直接通过任何Web服务器（apache / nginx / IIS）