typescript本地调试编译解析环境搭建两种方式：

1，node编译解析

npm install typesctipt -g
tsc --version

npm install ts-node -g

ts-node需要依赖两个包 tslib @types/node 所以执行

npm install tslib @types/node -g

然后就可以执行命令直接解析ts文件了

ts-node ts-text.ts

2.配置webpack编译解析并且热更新

首先创建一个文件夹进入目录打开终端执行npm init 一路回车会创建默认的package.json文件

npm init

安装ts-loader typesctipt

npm install ts-loader typescript -D

并且创建tsconfig.json文件

tsc --init

安装webpack-dev-server

npm install webpack-dev-server -D

安装html-webpack-plugin

npm install html-webpack-plugin -D

package.json文件中配置webpack打包命令

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build":"webpack",
    "serve": "webpack serve"
 },

创建文件 webpack.config.js进行webpack相关配置

const path=require("path");
const HtmlWebpackPlugin=require("html-webpack-plugin")

module.exports={
    mode:"development",
    entry:"./src/main.ts",  
    output:{
        path:path.resolve(__dirname,"./dist"),
        filename:"bundle.js"
    },   
    resolve:{
        extensions:[".ts",".js",".json",".cjs"]
    },
    module:{
        rules:[
            {
                test:/\.ts$/,
                loader:"ts-loader"
            }
        ]
    },
    plugins:[
        new HtmlWebpackPlugin({
          title:"skyline"
        })
    ]
}