webpack散记--Typescript

Typescript

1、js的超集

官网：typescriptlang.org/tslang.cn

来自：微软

安装：官方的  npm i typescript ts-loader --save-dev

第三方的  npm i typescript awesome-typescript-loader  --save-dev   //利用缓存啥的  好像更快一点

配置：

     tsconfig.json  //在根目录下

     webpack.consig.js

     tsconfig:

      配置选项
            官网/docs/handbook/compiler-options.html
      常用选项
            compilerOptions
            include
            exclude

2、eg
(1)初始化
     npm init
     npm install webpack typescript ts-loader awesome-typescript-loader --save-dev
(2)文件
    tsconfig.js
    src/app.js
    webpack.config.js
(3)webpack.config.js
    module.exports = {
  entry:{
    'app':'app.ts'
  },
  output:{
    filename:'[name].bundle.js'
  },
  module:{
    rules:[
      {
        test:/\.tsx?$/,
        use:{
          loader:'ts-loader'
        }
      }
    ]
  }
}

(4)tsconfig.json

{
"compilerOptions":{
"module":"commonjs",
"target":"es5",
"allowJs":true
},
"include":[
"./src/*"
],
"exclude":[
"./node_modules"
]
}