# npm
npm init
# git
git init
npm i typescript --save-dev
# 查看版本
npx tsc --version
npx tsc --init
新建 index.ts
文件。
项目目录:
├── package.json
├── tsconfig.json
└── src
└── index.ts
文件 index.ts
:
const ProjectName: string = 'new-typescript-project'
function say (): string {
return `This project is ${ProjectName}.`
}
console.log(say())
编译:
npx tsc src/index.ts
结果:
var ProjectName = 'new-typescript-project';
function say() {
return "This project is " + ProjectName + ".";
}
console.log(say());
监听文件变化:
npx tsc -w
npm install webpack webpack-cli -D
npm install ts-loader -D
const path = require('path');
module.exports = {
entry: './src/index.ts',
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
},
module:{
rules:[
{
test: /\.tsx?$/,
use: 'ts-loader',
exclude: /node_modules/
}
]
},
resolve: {
extensions: ['.ts', '.tsx']
}
};
npx webpack --config webpack.config.js
npm install --save-dev eslint @typescript-eslint/parser @typescript-eslint/eslint-plugin
# shell
touch .eslintrc
# .eslintrc
{
"root": true,
"parser": "@typescript-eslint/parser",
"plugins": [
"@typescript-eslint"
],
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/eslint-recommended",
"plugin:@typescript-eslint/recommended"
]
}
# shell
touch .eslintignore
# .eslintignore
node_modules
dist
"lint": "eslint . --ext .ts"
npm run lint
报错:
~/new-typescript-project/src/index.ts
1:7 error Type string trivially inferred from a string literal, remove type annotation @typescript-eslint/no-inferrable-types
修改相应代码:
- const ProjectName: string = 'new-typescript-project'
+ const ProjectName = 'new-typescript-project'
再次运行通过!
脚本添加 --fix
选项:
"lint-and-fix": "eslint . --ext .ts --fix"
"lint-and-fix": "eslint . --ext 'ts,tsx' --fix"