node编译TS时,tsconfig.json中的基础配置 与 webpack编译TS时webpack.config.js中的基础配置

简介: node编译TS时,tsconfig.json中的基础配置 与 webpack编译TS时webpack.config.js中的基础配置

一、node编译:tsconfig.json中的配置

{
  /*
  *  tsconfig.json 是ts编译器的配置文件,ts编译器可以根据它的信息,来对代码进行编译
    include 用来指定那些 ts 文件需要被编译
      路径:** 表示任意目录
            * 表示任意文件
    exclude 不需要被编译的文件目录
      默认值:[ "node_modules", "bower_components" ]
  */
  "include": [
    "./**/*"
  ],
  "exclude": [
    "./app/**/*"
  ],
  "extends": "",
  "files": [], // 类似于include,是一个文件列表,一般情况不用
  /*
  compilerOptions:编译器选项
  */
  "compilerOptions": {
    // target 用来指定 ts 被编译为 ES 的版本
    "target": "ES6",
    // module 指定使用的模块化规范
    // 'none', 'commonjs', 'amd', 'system', 'umd', 'es6', 'es2015', 'es2020',     
    // 'es2022‘,'esnext', 'node12', 'nodenext'
    "module": "asc",
    // lib 用来指定项目中要使用的库,正常不需要设置
    "lib": ["dom"],
    // outDir 指定编译后文件所在的目录
    "outDir": "./dist",
    // outFile 合并编译后的代码
    // 设置 outFile 后,所有的全局作用域代码会合并在同一个文件中
    "outFile": "./dist/app.js"
    // allowJs 是否对 js 文件进行编译,默认是false
    "allowJs": false,
    // checkJs 是否检查 js 代码是否符合语法规范
    "checkJs": false,
    // 是否编译注释
    "removeComments": true,
    // noEmit 不生成编译后的文件(只执行编译过程)
    "noEmit": false,
    // noEmitOnError 当有错误时,不生成编译后的文件
    "noEmitOnError": true,
    // 所有严格检查的总开关
    "strict": true,
    // alwaysStrict 用来设置编译后的文件是否开启严格模式
    "alwaysStrict": true,
    // noImplicitAny 不允许隐式的 any 类型
    "noImplicitAny": true,
    // noImplicitThis 不允许明确类型的 this
    "noImplicitThis": true,
    // 严格的空值检查
    "strictNullChecks": true 
}

二、webpack编译:webpack.config.js中的配置

const path = require('path');
const HTMLWebpackPlugin = require('html-webpack-plugin'); // 自动生成 html 插件
module.exports = {
    mode: "none",
    entry: "./src/index.ts",
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: "barry.js",
        //配置打包环境,告诉webpack不使用箭头函数
        environment: {
            arrowFunction: false
        }
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: [
                    {
                        // 指定加载器
                        loader: "babel-loader",
                        // 设置 babel
                        options: {
                            // 设置预定义环境
                            presets: [
                                [
                                    // 指定环境插件
                                    "@babel/preset-env",
                                    {
                                        // 要兼容的目标浏览器
                                        targets: {
                                            "chrome": "88",
                                            "ie": "11"
                                        },
                                        // core-js 使用版本
                                        "corejs": "3",
                                        "useBuiltIns": "usage"
                                    }
                                ]
                            ]
                        }
                    },
                    "ts-loader"],
                exclude: /node-modules/
            }
        ]
    },
    // 配置 webpack 插件
    plugins: [
        new HTMLWebpackPlugin({template: "./src/index.html"})
    ],
    // 用来设置引用模块
    resolve: {
        extensions: ['.ts', '.js']
    }
}
相关文章
|
6月前
|
资源调度 JavaScript 前端开发
前端开发必备!Node.js 18.x LTS保姆级安装教程(附国内镜像源配置)
本文详细介绍了Node.js的安装与配置流程,涵盖环境准备、版本选择(推荐LTS版v18.x)、安装步骤(路径设置、组件选择)、环境验证(命令测试、镜像加速)及常见问题解决方法。同时推荐开发工具链,如VS Code、Yarn等,并提供常用全局包安装指南,帮助开发者快速搭建高效稳定的JavaScript开发环境。内容基于官方正版软件,确保合规性与安全性。
5624 24
|
7月前
|
JavaScript 前端开发 数据可视化
【01】Cocos游戏开发引擎从0开发一款游戏-cocos环境搭建以及配置-Cocos Creator软件系统下载安装-node环境-优雅草卓伊凡
【01】Cocos游戏开发引擎从0开发一款游戏-cocos环境搭建以及配置-Cocos Creator软件系统下载安装-node环境-优雅草卓伊凡
417 2
【01】Cocos游戏开发引擎从0开发一款游戏-cocos环境搭建以及配置-Cocos Creator软件系统下载安装-node环境-优雅草卓伊凡
|
6月前
|
Prometheus 监控 JavaScript
Node.js连接池配置的五个隐形陷阱与防御体系:从创业公司血泪史说起
文章以创业公司血泪史为例,详细阐述了 Node.js 连接池配置的五个隐形陷阱及防御体系。包括连接泄漏、配置参数算术错误、异步异常导致崩溃、跨连接事务问题、监控缺失,并介绍了相应的解决办法和终极防御手段,强调在确定性与不确定性中寻找平衡,建立自适应机制。
122 13
|
10月前
|
存储 JavaScript 搜索推荐
Node框架的安装和配置方法
安装 Node 框架是进行 Node 开发的第一步,通过正确的安装和配置,可以为后续的开发工作提供良好的基础。在安装过程中,需要仔细阅读相关文档和提示,遇到问题及时解决,以确保安装顺利完成。
561 58
|
JavaScript
webpack打包TS
webpack打包TS
215 60
|
11月前
|
JavaScript
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
这篇文章介绍了如何将webpack的配置文件分离成开发环境和生产环境的配置文件,以提高打包效率。
178 1
webpack学习五:webpack的配置文件webpack.config.js分离,分离成开发环境配置文件和生产环境配置文件
|
12月前
|
JavaScript 应用服务中间件 Linux
宝塔面板部署Vue项目、服务端Node___配置域名
本文介绍了如何使用宝塔面板在阿里云服务器上部署Vue项目和Node服务端项目,并配置域名。文章详细解释了安装宝塔面板、上传项目文件、使用pm2启动Node项目、Vue项目打包上传、以及通过Nginx配置域名和反向代理的步骤。
3078 1
宝塔面板部署Vue项目、服务端Node___配置域名
|
移动开发 JavaScript 前端开发
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
这篇文章介绍了在UniApp H5项目中处理跨域问题的两种方法:通过修改manifest.json文件配置h5设置,或在项目根目录创建vue.config.js文件进行代理配置,并提供了具体的配置代码示例。
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
|
12月前
|
前端开发 JavaScript 安全
node登陆接口权限配置cookie-parser、express-session
本文介绍了在Node.js中使用express-session和cookie-parser实现登录接口的权限配置,包括验证码接口的生成和自定义中间件的创建,用于验证用户权限。
188 0
node登陆接口权限配置cookie-parser、express-session
|
JavaScript IDE 前端开发
前端开发工具配置 nodejs & git & IDE
前端开发工具配置 nodejs & git & IDE