TS配置笔记

{

  "include": [

​    "./src/**/*"

  ], *//指定哪些ts文件须要编译 **代表任意目录 \*代表任意文件*

  "exclude": [

​    "./src/other/**/*"

  ], *//指定哪些ts文件不须要编译 默认值 ["node_modules","bower_components","jspm_packages"]*

  "extends": "./configs/base", *// 定义被继承的配置文件*

  "files": [

​    *// "core.ts"*

  ], *//指定编译的文件*

  */** 

  *compilerOptions 编译器的选项*

  **/*

  "compilerOptions": {

​    "target": "es6", *//指定编译成的ES版本*

​    "module": "es6", *//指定要应用的模块化标准*

​    *// "lib": [], //指定我的项目中引入的库，将根据这些库进行类型查看/代码提醒 个别不须要批改 除非不是在浏览器环境下运行*

​    "outDir": "./dist", *//指定编译后的js文件寄存目录*

​    *// "outFile": "./dist/app.js", //将 全局作用域 编译后的代码合并到一个文件*

​    *// "allowJs": true, //是否编译js文件，默认为false*

​    *// "checkJs": true, //查看js代码是否符合规范 默认为false*

​    "removeComments": true, *//是否移除正文 默认为false*

​    "noEmit": false, *//不生成编译后的js文件 默认为false*

​    "noEmitOnError": false, *//当有谬误时，不生成编译后的js文件 默认false*

​    */\* 严格查看 \*/*

​    "alwaysStrict": false, *//编译后的js文件 应用严格模式 默认为false*

​    "noImplicitAny": false, *//不容许有隐式的any 默认为false 容许*

​    *// "noImplicitThis": true, //不容许有隐式类型的 this 默认为false*

​    *// "strictNullChecks": true, //严格的空值查看 默认为 false*

​    "strict": true, *//所有严格查看的总开关*

  }

}

webpack配置

/*
 * @Description:
 * @Author: forceddd
 * @Date: 2021-04-02 16:50:07
 */
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');


module.exports = {
    mode: 'development',
    //入口文件
    entry: './src/index.ts',
    //打包后的文件
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[name].bundle.js',
        clean: true,
        //配置打包环境
        environment: {
            //不实用箭头函数
            arrowFunction: false
        }
    },
    //指定webpack打包时 应用到的模块 
    module: {
        //指定打包时加载模块的规定
        rules: [
            {
                test: /\.ts$/,
                use: [
                    //配置babel
                    {
                        loader: 'babel-loader',
                        //配置babel
                        options: {
                            //设置预约义的环境 数组
                            presets: [
                                //第一个环境
                                [
                                    //要应用的插件
                                    '@babel/preset-env',
                                    //配置信息
                                    {
                                        //要兼容的指标浏览器
                                        targets: {
                                            'chrome': '88',
                                            'ie': '11'
                                        },
                                        //指定corejs的版本 corejs为不反对es6新个性的浏览器提供了本人的实现
                                        'corejs': '3',
                                        //应用corejs 的形式 usage 按需加载
                                        'useBuiltIns': 'usage',
                                    }
                                ]
                            ]
                        }
                    }, 'ts-loader'],
                exclude: /node_modules/
            }
        ]
    },
    devServer: {
        contentBase: './dist',
        hot: true
    },
    devtool: 'inline-source-map',
    plugins: [
        new HtmlWebpackPlugin({
            title: 'ts-learning'
        }),
    ],
    //resolve 通知webpack 哪些文件能够作为模块被引入
    resolve: {
        extensions: ['.ts', '.js']
    }
}