TS-Node 体验
【给链接不赘述】【提醒坑】【想更简单学计算机必须会看懂英语】【win让你专注代码未来深入linux】【尽管文件恨多,但是我们不去dissect 是永远不会的】
https://www.tslang.cn/docs/handbook/typescript-in-5-minutes.html
https://github.com/Microsoft/TypeScript-Node-Starter#typescript-node-starter
https://docs.mongodb.com/manual/tutorial/install-mongodb-on-windows/
【锦囊妙计】npm install 如果遇到问题,请使用npm doctor
……………………………………………………………………
启动 mongod
"C:\Program Files\MongoDB\Server\3.6\bin\mongod.exe" --dbpath "C:\Dev\mongodb\data"
……………………………………………………………………………………………………
npm run build == VSCODE快捷键ctrl+shift+b
npm start == VSCODE快捷键 ctrl+shift+p 然后输入run task选择npm start
打开 http://localhost:3000
…………………………………………………………………………
=>跳过【Deploy 部署环节】
…………………………………………………………………………………………………………………………………………………………………………………………………………
项目结构,由于TS比较工程化,最主要的是【ts文件在src下,编译后在dist下】
| Name | Description |
|---|---|
| .vscode | 内建 |
| dist | Contains the distributable (or output) from your TypeScript build. This is the code you ship |
| node_modules | Contains all your npm dependencies |
| src | Contains your source code that will be compiled to the dist dir |
| src/config | Passport authentication strategies and login middleware. Add other complex config code here |
| src/controllers | Controllers define functions that respond to various http requests |
| src/models | Models define Mongoose schemas that will be used in storing and retrieving data from MongoDB |
| src/public | Static assets that will be used client side |
| src/types | Holds .d.ts files not found on DefinitelyTyped. Covered more in this section |
| src/server.ts | 程序入口 |
| test | Contains your tests. Seperate from source because there is a different build process. |
| views | Views define how your app renders on the client. In this case we're using pug |
| .env.example | API keys, tokens, passwords, database URI. Clone this, but don't check it in to public repos. |
| .travis.yml | Used to configure Travis CI build |
| .copyStaticAssets.ts | Build script that copies images, fonts, and JS libs to the dist folder |
| jest.config.js | Used to configure Jest |
| package.json | File that contains npm dependencies as well as build scripts |
| tsconfig.json | Config settings for compiling server code written in TypeScript |
| tsconfig.tests.json | Config settings for compiling tests written in TypeScript |
| tslint.json | Config settings for TSLint code style checking |
…………………………………………………………………………………………………………………………………………………………………………
编译是可以配置的。tsconfig.json
"compilerOptions": {
"module": "commonjs",
"esModuleInterop": true, //导入语法 import foo from "foo"
"target": "es6",
"noImplicitAny": true, //【最佳实践】true打开的话对应我们要用任何的Library都需要.d.ts即使是空定义,放心可以下载。
"moduleResolution": "node",
"sourceMap": true, //debug用
"outDir": "dist",
"baseUrl": ".",
"paths": { //默认会去扫描node_modules下@types(.d.ts文件),我们私有定义.d.ts不是下载来的要配置一下。
"*": [
"node_modules/*",
"src/types/*"
]
}
},
"include": [ //将需要编译的文件包含进来,也可以exclude掉
"src/**/*"
]
…………………………………………………………………………………………………………………………………………………………………………
构建,其中package.json有可供我们调用的命令,npm run <script-name>
| Npm Script | Description |
|---|---|
start |
Does the same as 'npm run serve'. Can be invoked with npm start |
build |
Full build. Runs ALL build tasks (build-sass, build-ts, tslint, copy-static-assets) |
serve |
Runs node on dist/server.js which is the apps entry point |
watch-node |
Runs node with nodemon so the process restarts if it crashes. Used in the main watch task |
watch |
Runs all watch tasks (TypeScript, Sass, Node). Use this if you're not touching static assets. |
test |
Runs tests using Jest test runner |
watch-test |
Runs tests in watch mode |
build-ts |
Compiles all source .ts files to .js files in the dist folder |
watch-ts |
Same as build-ts but continuously watches .ts files and re-compiles when needed |
build-sass |
Compiles all .scss files to .css files |
watch-sass |
Same as build-sass but continuously watches .scss files and re-compiles when needed |
tslint |
Runs TSLint on project files |
copy-static-assets |
Calls script that copies JS libs, fonts, and images to dist directory |
debug |
Performs a full build and then serves the app in watch mode |
serve-debug |
Runs the app with the --inspect flag |
watch-debug |
The same as watch but includes the --inspect flag so you can attach a debugger |
…………………………………………………………………………………………………………………………………………………………………………
.d.ts 文件用来定义类型,这是因为不是所有js都有ts版本,通过这项定义,ts将帮助编辑器获得类型提示。
有些.d.ts甚至不需要我们操心,可以去下载 => https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types
//.d.ts日常管理
1.当npm install包的时候,对应我们去下载.d.ts文件。
【下载DefinitelyTyped】npm install --save-dev @types/jquery (务必加选项或者-D,因为只是编译期需要的依赖。)
2.下载不到,我们就要去tsconfig.json配置下path包含我们自己定义的.d.ts文件。
【自己定义.d.ts】参见 => https://github.com/Microsoft/dts-gen
如果没成功生成的话,需要【跳过.d.ts类型检查】直接在文件中写 declare module "<some-library>";//相当于空文件
然后可以继续一步一步改善(不能生成只好这样) http://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html
…………………………………………………………………………………………………………………………………………………………………………
TS-Node 体验的更多相关文章
- Node 体验 事件驱动、非阻塞式 I/O
https://github.com/nswbmw/N-blog/blob/master/book/2.1%20require.md 全局对象和浏览器中的window类似 1.console.log( ...
- 【Nodejs】375- 如何加快 Node.js 应用的启动速度
我们平时在开发部署 Node.js 应用的过程中,对于应用进程启动的耗时很少有人会关注,大多数的应用 5 分钟左右就可以启动完成,这个过程中会涉及到和集团很多系统的交互,这个耗时看起来也没有什么问题. ...
- 基于Node.js + jade + Mongoose 模仿gokk.tv
原文摘自我的前端博客,欢迎大家来访问 http://www.hacke2.cn 关于gokk 大学的娱乐活动基本就是在寝室看电影了→_→,一般都会选择去goxiazai.cc上看,里面的资源多,质量高 ...
- 使用 typescript ,提升 vue 项目的开发体验(2)
此文已由作者张汉锐授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. vuex-class 提供了和 vuex 相关的全部装饰器,从而解决了上面 Vue.extend + vue ...
- Node.js + TypeScript + ESM +HotReload ( TypeScript 类型的 Node.js 项目从 CommJS 转为 ESM 的步骤)
当前 Node.js 版本:v16.14.0 当前 TypeScript 版本:^4.6.3 步骤 安装必要的依赖 yarn add -D typescript ts-node @tsconfig/n ...
- vue + typescript 项目起手式
https://segmentfault.com/a/1190000011744210 2017-10-27 发布 vue + typescript 项目起手式 javascript vue.js t ...
- 分享:使用 TypeScript 编写的 JavaScript 游戏代码
<上篇博客>我写出了我一直期望的 JavaScript 大型程序的开发模式,以及 TS(TypeScript) 的一些优势.博客完成之后,我又花了一天时间试用 TS,用它来重构之前编写的一 ...
- TreeView递归绑定无限分类数据
TreeView递归绑定无限分类数据 实现一个动态绑定,无限级分类数据时,需要将数据绑定到TreeView控件,分类表的结构是这样的: 字段 类型 Id int ParentId int Name N ...
- 分享:使用 TypeScript 编写的游戏代码
<上篇博客>我写出了我一直期望的 JavaScript 大型程序的开发模式,以及 TS(TypeScript) 的一些优势.博客完成之后,我又花了一天时间试用 TS,用它来重构之前编写的一 ...
- React Native工程中TSLint静态检查工具的探索之路
建立的代码规范没人遵守,项目中遍地风格迥异的代码,你会不会抓狂? 通过测试用例的程序还会出现Bug,而原因仅仅是自己犯下的低级错误,你会不会抓狂? 某种代码写法存在问题导致崩溃时,只能全工程检查代码, ...
随机推荐
- LOJ#6280. 数列分块入门 4
另外开一个数组维护每一个块内的总和. 给区间加值是,残余的块一个一个点更新,整个的块一次性更新 查询的时候也是,残余的块一个一个点加,整个的块一次性加 #include<map> #inc ...
- nio 阻塞 非阻塞 同步 异步
https://mp.weixin.qq.com/s/5SKgdkC0kaHN495psLd3Tg 说在前面 上篇NIO相关基础篇二,主要介绍了文件锁.以及比较关键的Selector,本篇继续NIO相 ...
- 百度地图API示例:使用vue添加删除覆盖物
1.index.html <script type="text/javascript" src="http://api.map.baidu.com/api?v=2. ...
- RGBColorspace 与 GRAYColorspace 图片混合后,生成的视频有点问题
最近有一个用户遇到一个情况: 有3张图片,其中前两张是 RGBColorspace,最后一张是 GrayColorspace: 生成的视频,在显示最后一张图片的时候,明显出现奇怪的色彩区域,看下图: ...
- bzoj 4326: NOIP2015 运输计划(二分+树链剖分)
传送门 题解: 树链剖分快速求解任意两点间的路径的权值和: 然后,二分答案: 此题的难点是如何快速求解重合路径? 差分数组可以否??? 在此之前先介绍一下相关变量: int fa[maxn]; int ...
- 如何自学 Android 的?
http://android.jobbole.com/83380/ 1. Java知识储备 本知识点不做重点讲解:对于有基础的同学推荐看<Java编程思想>,巩固基础,查漏补全,了解并熟悉 ...
- easyUI,重新渲染
Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 可以使用$.parser.parse();这个方法进行处理: 例如: $.parser.parse(); 表示对整个页面重新 ...
- 跨域技术(JSONP与CROS)
JSONP 我们发现,Web页面上调用js文件时不受是否跨域的影响,凡是拥有"src"这个属性的标签都拥有跨域的能力,比如<script>.<img>.&l ...
- jmeter-录制, 编辑脚本,性能测试全过程review
录制脚本 jmeter下载安装略过不谈,上步骤: 1.在测试计划新建-threads-线程组 2.在工作台新建-非测试原件-http代理服务器,设置端口和包含网址 不包含网址 3.在手机/浏览器,设置 ...
- Go-day04
今日概要: 1.内置函数.递归函数.闭包 2.数组与切片 3.map数据结构 4.package介绍 5.互斥锁和读写锁 一.内置函数 1.close:主要用来关闭channel 2.len:用来求长 ...