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,而原因仅仅是自己犯下的低级错误,你会不会抓狂? 某种代码写法存在问题导致崩溃时,只能全工程检查代码, ...
随机推荐
- [AH2017/HNOI2017]礼物(FFT)
题目描述 我的室友最近喜欢上了一个可爱的小女生.马上就要到她的生日了,他决定买一对情侣手 环,一个留给自己,一 个送给她.每个手环上各有 n 个装饰物,并且每个装饰物都有一定的亮度.但是在她生日的前一 ...
- servlet 上下文
一.应用需求: 如何统计网站在线人数? 使用ServletContext. 二.ServletContext详解: 1.是不同于session和cookie,是可以让所有客户端共同访问的内容,是在服务 ...
- javascript的性能优化tips
谈到javascript的性能优化,有好多点,比如把script放到离body闭合标签附近,合并多个script标签等等,还有一些代码的性能,for的性能不如while的性能好,用while模拟for ...
- AITP
AITP AITP比较简单,适合刚毕业,即将开始IT生涯的学生.接受CIPS认证课程的毕业生可以自动获得AITP证书,并获得一年的免费的CIPS会员资格. 接受非CIPS认证课程的毕业生需要申请,另外 ...
- OpenLayers学习笔记(四)— QML显示html中openlayers地图的坐标
GitHub:八至 作者:狐狸家的鱼 本文链接:实现QML中显示html中地图的坐标 如何QML与HTML通信已经在这篇文章 QML与HTML通信之画图 详细讲述了 1.HTML var coord; ...
- 【洛谷P1059 明明的随机数】
题目描述明明想在学校中请一些同学一起做一项问卷调查,为了实验的客观性,他先用计算机生成了N个1到1000之间的随机整数(N≤100),对于其中重复的数字,只保留一个,把其余相同的数去掉,不同的数对应着 ...
- ANIS与UNICODE字符格式转换:MultiByteToWideChar() 和WideCharToMultiByte() 函数
资料来自: http://blog.csdn.net/holamirai/article/details/47948745 http://www.cnblogs.com/wanghao111/arch ...
- Sublime Text3—软件安装、package control插件管理
一.简介 市面上的编辑器纷繁复杂各有优点,好用的编辑器能让你工作事半功倍,先简单介绍下本文主角Sublime Text编辑器,下面简称Sublime. 1.可用于 Windows.Mac OS X 和 ...
- postman 抓包工具charles的使用
1.直接打开charles,然后,如果有https的话,需要安装证书,然后,设置代理 2.如果不是https的,不需要设置代理,直接抓取就可以 先安装证书: 然后设置代理: ...
- 使用postman测试hystrix
当在浏览器发送多次请求检测hystrix的作用时,我们可以使用postman来自动发送多次请求: 1.将链接保存到一个collection中 2.点击runner 3.设定运行次数