首先创建一个文件夹learnTs
,之后进入这个文件夹,然后与npm init
·配置好后,
运行cnpm install typescript tslint
,之后运行npx tsc --init
初始化配置文件,
之后安装webpack cnpm install -D webpack webpack-cli webpack-dev-server
cnpm install -D ts-loader
cnpm install -D clean-webpack-plugin html-webpack-plugin
之后新建一个webpack.config.js
const HtmlWebpackPlugin = require('html-webpack-plugin');
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
module.exports = {
entry:"./src/index.ts",
module:{
rules:[
{
test:/\.ts$/,
use:'ts-loader',
exclude:/node_modules/
}
]
},
devtool:'inline-source-map',
output:{
filename:"main.js",
},
devServer:{
contentBase:'./dist'
},
plugins:[
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
template: './index.html'
})
]
}
package.json写入
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack-dev-server"
},
src下创建一个index.ts文件
let a:number = 123
console.log(a)
npm run dev
运行成功
网友评论