ts学习笔记day1

0704 学习

• 模块化问题

  • 在同一个文件夹编译ts时，虽然是不同的文件夹但是ts还是会一起编译，这时候就会出现

    变量冲突，只需要导出一个空对象表明这个文件是一个单独的模块

  export {}
  

• 快捷编译方式

  • 使用webpack

    首先安装webpack webpack4.x以上 同时需要安装webpack-cli

    必须有tsconfig.json 使用 tsc --init 会生成默认配置文件

    安装 webpack-dev-server 搭建本地服务

    安装 html-webpack-plugin 生成html模板

     // webpack.config.js
    module.exports = {
         entry:'XXX.ts' // 入口文件
         output:{
         path:'xxxx', // 出口文件路径
         filename:'xxxx',// 自定义出口文件name
     	 },
        devServer:{},
        resolve:{
          extensions:['.ts','.cjs','json']  // 也需要匹配ts文件 开启了的这个配置那么js文件也需要加进去
        },
         module:{
          rules:[
              {
                  test:/\.ts$/, // 正则匹配所有ts文件
                  loader:'ts-loader',// 使用 ts-loader
                   
              }
          ]   
         }
     }
    
    

    // tsconfig.json
    
    

  • 在node环境下 npm 安装 ts-node 命令行 ts-node ts文件自动编译

---

• 类型大小写的含义

  • string/number/boolean 小写代表 ts中的类型
  • String/Number/Boolean 大写代表js中的类型类

• 变量声明

  • let /const/var xx:number = 1233
  • let xx = 123 ts里具有类型推导
  • let xxx :Array = [] // 数组里最好存放同一种类型数据 这里指定这个数组存放字符串
  • let xxx:string[]=[]