TypeScript入门
微软开发的编程语言，是JavaScrip的超集，遵循了ES6的语法。
前置知识：
· 理解ES5、6，JavaScript,TypeScript的概念和关系
· 有基础的JavaScript开发经验
TypeScript的优势
· 支持ES6规范
· 强大的IDE支持
· Angular2的开发语言
搭建TypeScript开发环境
npm install -g typescript
手动配置Webapck
因为webpack是基于nodejs环境下的，所以我们首先创建node项目
npm init | yarn init
创建完成后，执行全局安装命令
npm install -g webpack
紧接着执行nodejs项目依赖安装
npm install webpack --save | yarn add webpack --dev
yran解决了什么？
- 离线模式
已安装过的软件包，再次安装时不用再从网络下载
- 依赖关系确定性
每一台机器上针对同一个工程安装依赖时，生成的依赖关系顺序和版本是一致的
- 更好的网络性能
下载软件包时，会进行更好的排序，避免”请求瀑布”，最大限度提高网络利用率
- 多注册来源处理
所有的依赖包，不管是否被不同的库间接关联引用多少次，安装这个包时，只会从一个注册来源去安装，要么使用NPM，要么是Bower，防止出现混乱不一致。
- 网络弹性处理
安装依赖时，不会因为某个单次网络请求的失败导致整个安装挂掉。当请求失败时回进行自动重试
- 扁平模式
当关联依赖中包括对某个软件包的重复引用，在实际安装时将尽量避免重复的创建
webpack 的意义？
webpack获取带依赖的模块并产出与这些模块相对于的静态资源。
- webpack的目标：
· 拆分依赖书成块并按需加载
· 让初始化加载时间更少
· 每一个静态资源应该是一个模块
· 能够集成第三方类库
· 适用于大型项目
· 能够定制模块打包的每一个部分
- Plugins(插件)
webpack有着丰富的插件接口,这使得webpack非常的灵活
- Performance(性能)
webpack使用异步I/O和多级缓存,这使得webpack在增量编译上极其快.
- Loader(装载机)
webpack支持通过装载机预处理文件.这允许你处理任何静态资源(不仅仅是JavaScript),你可以很轻松的写出在Nodejs上运行的装载机.
- Suport(支持)
webpack支持AMD和CommonJs模块样式.它巧妙的在你代码的AST中进行静态分析,它甚至还能处理简单的表达式,这样就允许你支持更多的类库.
- Code Splitting(代码拆分)
webpack允许你将你的代码拆分成块,每块代码按需加载,这样就可以减少初始化加载时间.
- Optimizations(优化)
webpack可以大量的优化来减少输出的大小,并使用hashes来实现请求缓存.
- Development Tools(开发工具)
webpack支持SourceUrls和SourceMaps进行简单的调试.通过development middleware来监控文件和development server来自动刷新.
- Multiple targets(多个目标)
webpack的主要目标是web,同时它也支持为nodejs和WebWorkers上的代码打包.
- Motivation(动机)
现在的website正在慢慢演变为webapps:
· 越来越多的JavaScript代码被使用
· 现代浏览器提供了丰富的接口
· 更少的全页面重载，也就意味着单页面需要加载更多的代码.
这样的结果就是大量的代码会存在于client side.这样大量的代码就需要被组织.模块系统可以有效的管理你的代码.
报错问题
node-gyp 报错、 xcode-select报错
删除已经安装的CommandLineTools
xcode-select --install
数据源报错问题，可以切换淘宝源尝试 npm install -g cnpm --registry=https://registry.npm.taobao.org
重新安装即可
