Vue 3 Vite 项目打包优化:自动删除指定文件的方法

程序员必备宝典https://tmxkj.top/#/ 在 Vue 3 项目中,如果你需要在打包之前删除指定的文件,可以使用 Node.js 的 fs 模块来实现。这可以通过在 vue.config.js 文件中配置一个自定义的 Webpack 插件来完成。

1.安装必要的依赖(如果还没有安装):

复制代码
npm install --save-dev fs-extra

2.创建或编辑 vue.config.js 文件

复制代码
const { defineConfig } = require('@vue/cli-service');
const fs = require('fs-extra');
const path = require('path');

module.exports = defineConfig({
  configureWebpack: config => {
    // 添加一个自定义插件来删除指定文件
    config.plugins.push({
      apply: (compiler) => {
        compiler.hooks.beforeRun.tapPromise('RemoveFilePlugin', async () => {
          const filePath = path.resolve(__dirname, 'path/to/your/file.txt'); // 替换为你要删除的文件路径
          try {
            await fs.remove(filePath);
            console.log(`Successfully removed file: ${filePath}`);
          } catch (err) {
            console.error(`Error removing file: ${filePath}`, err);
          }
        });
      }
    });
  }
});

3.如果需要获取到 package.json 里面的相关信息,例如获取version 版本号

复制代码
        const packageJsonPath = path.resolve(__dirname, 'package.json');
        const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
        version.value = packageJson.version;
相关推荐
百锦再几秒前
Python、Java与Go:AI大模型时代的语言抉择
java·前端·vue.js·人工智能·python·go·1024程序员节
IT_陈寒2 分钟前
Vite 3.0终极提速指南:5个鲜为人知的配置技巧让构建效率翻倍
前端·人工智能·后端
菩提树下的凡夫13 分钟前
前端vue的开发流程
前端·javascript·vue.js
青山的青衫18 分钟前
【用homebrew配置nginx+配置前端项目与后端联调】Macbook M1(附一些homebrew操作)
运维·前端·nginx
二十雨辰21 分钟前
[作品集]-容易宝
java·开发语言·前端
Zz燕34 分钟前
G6实战_手把手实现简单流程图
javascript·vue.js
恋猫de小郭39 分钟前
iOS 26 开始强制 UIScene ,你的 Flutter 插件准备好迁移支持了吗?
android·前端·flutter
Asort39 分钟前
JavaScript设计模式(二十一)——策略模式:灵活算法的艺术与实战
前端·javascript·设计模式
黑云压城After1 小时前
3D魔方-Css实现方法
前端·css·3d
腾蛇月猫1 小时前
Excel转VCF文件一键导入通讯录联系人信息
javascript·excel·vcf