webpack风格，ts和css加载器应该只构建当前文件夹内的文件

webpack是一个现代化的前端构建工具，它可以将多个前端资源（如JavaScript、CSS、图片等）打包成一个或多个静态资源文件，以便在浏览器中加载和使用。

在webpack中，加载器（Loader）是用于对特定类型的文件进行处理和转换的插件。对于ts和css文件的加载，可以使用相应的加载器来处理。

对于ts文件，可以使用ts-loader加载器来处理。ts-loader是一个TypeScript加载器，它会将TypeScript代码转换为JavaScript代码。它的优势在于可以在构建过程中进行类型检查，并且支持各种TypeScript的配置选项。在webpack配置中，可以通过配置module.rules来指定对.ts文件使用ts-loader加载器。

对于css文件，可以使用css-loader加载器来处理。css-loader会解析CSS文件，并将其转换为JavaScript模块，以便在浏览器中使用。它的优势在于支持CSS模块化、自动添加浏览器前缀等功能。在webpack配置中，可以通过配置module.rules来指定对.css文件使用css-loader加载器。

当只需要构建当前文件夹内的文件时，可以使用webpack的resolve.modules配置项来指定模块的搜索路径。可以将当前文件夹添加到resolve.modules中，这样webpack在查找模块时会优先搜索当前文件夹内的模块。

以下是一个示例的webpack配置文件，展示了如何配置ts-loader和css-loader，并指定只构建当前文件夹内的文件：

const path = require('path');

module.exports = {
  entry: './src/index.ts',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        include: path.resolve(__dirname, 'src'),
        use: 'ts-loader',
      },
      {
        test: /\.css$/,
        include: path.resolve(__dirname, 'src'),
        use: ['style-loader', 'css-loader'],
      },
    ],
  },
  resolve: {
    modules: [path.resolve(__dirname, 'src'), 'node_modules'],
    extensions: ['.ts', '.js'],
  },
};

在这个示例中，entry指定了入口文件为src/index.ts，output指定了输出文件为dist/bundle.js。module.rules中配置了对.ts文件使用ts-loader加载器，并指定只包括src文件夹内的文件；对.css文件使用style-loader和css-loader加载器，并同样指定只包括src文件夹内的文件。resolve.modules中将src文件夹添加到模块搜索路径中。

推荐的腾讯云相关产品和产品介绍链接地址：

• 云开发（CloudBase）：腾讯云提供的一站式后端云服务，支持云函数、云数据库、云存储等功能，方便快速搭建和部署应用。
• 云服务器（CVM）：腾讯云提供的弹性计算服务，提供高性能、可扩展的云服务器实例，适用于各种应用场景。
• 对象存储（COS）：腾讯云提供的安全可靠的云端存储服务，支持存储和管理各种类型的数据，适用于大规模数据存储和分发。
• 人工智能（AI）：腾讯云提供的人工智能服务，包括图像识别、语音识别、自然语言处理等功能，帮助开发者构建智能化应用。
• 物联网（IoT）：腾讯云提供的物联网开发平台，支持设备接入、数据采集、远程控制等功能，帮助开发者快速构建物联网应用。
• 区块链（BCB）：腾讯云提供的区块链服务，支持构建和管理区块链网络，提供安全可信的区块链应用开发环境。
• 云原生应用平台（TKE）：腾讯云提供的容器服务平台，支持容器化应用的部署和管理，提供高可用、弹性扩展的容器集群。
• 音视频处理（VOD）：腾讯云提供的音视频处理服务，支持音视频上传、转码、剪辑、播放等功能，适用于多媒体应用场景。

请注意，以上推荐的腾讯云产品仅供参考，具体选择应根据实际需求进行评估和决策。