打包的时候自定义dist文件名

你可以在 `webpack.config.js` 文件中配置打包后的文件名。具体的做法是，在该文件中找到 `output` 属性，然后修改其中的 `filename` 属性，例如：

module.exports = {
  // ...
  output: {
    filename: 'my-bundle.js'
  }
}

这会将打包后的文件名修改为 `my-bundle.js`。另外，你也可以使用占位符来自定义打包后的文件名，例如：

module.exports = {
  // ...
  output: {
    filename: '[name].[hash].js'
  }
}

这会将打包后的文件名设置为 `[name].[hash].js`，其中 `[name]` 会被替换为入口文件的名称，`[hash]` 会被替换为一个哈希值，以便于浏览器缓存。

相关问题

vitevue修改打包之后dist文件夹名称

Vite是一个轻量级的前端构建工具，结合Vue.js构建高性能应用。当你使用Vite配合Vue项目进行构建时，修改打包后的`dist`文件夹名称通常是通过配置`vite.config.ts`来实现的。

在`vite.config.ts`文件中，你可以找到`build`部分，它通常包含一个`output`选项，用于设置生成的静态资源文件的位置和命名规则。例如：

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
  build: {
    // 修改输出目录名
    outDir: 'your-desired-output-folder', // 替换为你的自定义名称
    assetsDir: 'static', // 如果你想改变静态资源文件夹名

    // 或者直接修改 output 过滤器
    rollupOptions: {
      input: 'src/main.js',
      output: {
        dir: 'dist', // 默认的 dist 文件夹位置保持不变
        format: 'es', // 输出格式
        assetFileNames: 'my-custom-name/[name].[hash].js', // 更改文件名模板
      },
    },
  },
  plugins: [vue()],
});

将上述示例中的`'your-desired-output-folder'`替换为你想要的新名称即可。记得保存更改并运行`vite build`命令，新的打包结构将会按照新设定的名称创建。

rollup打包多个文件输出多个chunk时如何定制chunk的文件名

Rollup是一个JavaScript模块打包工具，当它需要将多个输入文件打包成多个chunk（代码块）时，你可以通过配置rollup.config.js文件来定制每个chunk的输出文件名。以下是几个关键步骤：

1. 安装`rollup-plugin-chunk-names`插件，这个插件可以帮助你管理chunk的名称：

   npm install rollup-plugin-chunk-names --save-dev

2. 在`rollup.config.js`中引入并配置该插件：

   import { rollup } from 'rollup';
   import chunkNames from 'rollup-plugin-chunk-names';

   export default {
     input: 'src/main.js', // 或者你的源文件路径
     output: {
       file: 'dist/bundle.js', // 主bundle文件
       format: 'iife', // 输出格式，如es或iife
       name: 'myApp', // 应用于所有输出的全局变量名
       chunks: {
         named: true, // 启动命名chunk模式
       },
     },
     plugins: [
       chunkNames({
         // 自定义chunk名称策略
         separator: '-',
         allChunks: true, // 为每个chunk设置名字，而不是仅限entry point
         match: /^index/, // 只给入口点chunk起名，其他按默认规则
         extensions: ['.js'], // 指定chunk文件扩展名
       }),
     ],
   };

这里，`separator`指定了chunk名之间的分隔符，`allChunks`表示是否为每个chunk命名，`match`可以让你指定哪些chunk应该有特定的命名规则。