Question

我是webpack的新手，但仍然有点困惑webpack如何与加载程序协同工作。我们下面有打字稿文件index.ts：

//index.ts

import "bootstrap/dist/css/bootstrap.css";

...
// typescript code

和以下是webpack配置文件：

module.exports = {
    mode: "development",
    entry: "./src/index.ts",
    output: { filename: "bundle.js" },
    resolve: { extensions: [".ts", ".js", ".css"] },
    module: {
        rules: [
            { test: /\.ts/, use: "ts-loader", exclude: /node_modules/ },
            { test: /\.css$/, use: ["style-loader", "css-loader"] }
        ]
    }
};

以下是我个人对于webpack如何与加载程序一起工作的想法，如果我错了，请纠正我：

第1步-Webpack遇到index.ts，因此它将此文件传递给ts-loader，并且ts-loader读取该文件并将其传递给ts编译器，ts编译器生成js代码文件{{ 1}}，然后传递回index.js，然后ts-loader将ts-loader传递回webpack。

步骤2-Webpack读取index.js并需要解析css文件，因此Webpack将任务传递给index.js，因此css-loader将css文件读取为长字符串，然后将任务传递给css-loader，后者会创建js代码，该代码可以嵌入index.html文件中的标签中。

第3步-style-loader准备就绪，客户端发送http请求以获取bundle.js，然后提取index.html并创建一个

style-loader和css-loader的工作流程是什么