typescript语言简单使用教程

安装nodejs，就有了npm

安装ts

npm install -g typescript

查看版本

tsc -v

执行，生成index.js

tsc index.ts

输出执行

node index.js 

安装模块

npm init

生成package.json文件

npm install typescript webpack awesome-typescript-loader source-map-loader --save-dev

npm install jquery --save
npm install @types/jquery --save

添加tsconfig.json

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

添加webpack.config.js

module.exports = {
        entry: "./src/app.ts",
        output: {
            filename: "app.js",
            path: __dirname + "/dist"
        },
        devtool: "source-map",

        resolve: {
            extensions: [".webpack.js", ".web.js", ".ts", ".tsx", ".js"]
        },
        module: {
            rules: [
                {
                    test: /\.js$/,
                    enforce: "pre",
                    loader: "source-map-loader"
                },
                {
                    enforce: 'pre',
                    test: /\.tsx?$/,
                    use: "source-map-loader"
                },
                {
                    test: /\.tsx?$/,
                    loader: 'awesome-typescript-loader',
                    exclude: /node_modules/
                },
            ]
        },
        externals: {},
}

命令

webpack

不能用把它安装到全局里

npm install webpack -g
npm install webpack-cli -g

npm uninstall -g xxx

【npm install xxx】利用 npm 安装xxx模块到当前命令行所在目录；
【npm install -g xxx】利用npm安装全局模块xxx；
【npm install xxx】安装但不写入package.json；
【npm install xxx –save】 安装并写入package.json的”dependencies”中；
【npm install xxx –save-dev】安装并写入package.json的”devDependencies”中。