Webpack系列——TypeScript 的打包配置

最新推荐文章于 2024-08-14 14:02:53 发布

要不要吃烤肉

最新推荐文章于 2024-08-14 14:02:53 发布

阅读量483

点赞数

分类专栏： webpack 文章标签： typescript webpack javascript 前端

本文链接：https://blog.csdn.net/Smart_J_King/article/details/122456472

版权

一、TypeScript

TypeScript 是 JavaScript 类型的超集，它能够被转换为普通的 JavaScript。为了在 webpack cli 中使用 ts ，需要安装特定的 loader 来转换 ts 语法。

1.1 依赖安装

npm install typescript ts-loader -D

1.2 webpack.config.js

const path = require('path')

module.exports = {
    mode: 'development',
    devtool: 'cheap-module-eval-source-map'
    entry: './src/index.ts' // 以 index.ts 文件作为入口文件
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude: /node-modules/
            }
        ]
    },
    resolve: {
        extensions: ['.tsx', '.ts', '.js']
    },
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist')
    }
}

设置 “ ./src/index.ts ”作为入口文件，利用 ts-loader 加载所有 .ts以