ts环境搭建

安装全局ts

npm install -g typescript

生成配置文件

tsc --init

初始化工程

npm init

工程化

安装webpack、webpack-cli、webpack-dev-server、ts-loader、typescript、html-webpack-plugin

npm install webpack webpack-cli webpack-dev-server ts-loader typescript html-webpack-plugin -D

webpack配置 创建目录build/webpack.comfig.js，src中创建index.ts,public目录中创建index.html空模板

const HtmlWebpackPlugin = require('html-webpack-plugin') module.exports = {     entry: './src/index.ts',     output: {         filename: 'app.js'     },     // 扩展名     resolve: {         extensions: ['.js', '.ts', '.tsx']     },     devtool: "cheap-module-eval-source-map",     module: {         rules: [{             test: /\.tsx?$/i,             use: [{                 loader: 'ts-loader'             }],             exclude: /node_modules/         }]     },     plugins: [         new HtmlWebpackPlugin({             template: './public/index.html'         })     ] }

配置package.json中script

        "dev": "webpack-dev-server --config ./build/webpack.config.js"

测试一下

npm run dev