vue项目打包后提交到git上为什么没有dist这个文件?

简介: vue项目打包后提交到git上为什么没有dist这个文件?

vue项目中使用npm run build打包后会生成一个dist文件,使用git推送项目后,发现git上少了一个dist文件,为什么明明本地项目中有这个文件而推上去就没有了呢?

这里会先介绍.gitignore,不想看的 请直接跳过介绍 看解决办法

目录

一、.gitignore 介绍

这里向大家简述一下.gitignore这个文件

一、简绍

image.png

二、常用的规则

/mtk/ 过滤整个文件夹
*.zip 过滤所有.zip文件
/mtk/do.c 过滤某个具体文件

image.png

!src/   不过滤该文件夹
!*.zip   不过滤所有.zip文件
!/mtk/do.c 不过滤该文件

1、配置语法:

image.png

此外,git 对于 .ignore 配置文件是按行从上到下进行规则匹配的,意味着如果前面的规则匹配的范围更大,则后面的规则将不会生效;

2、示例说明

a、规则:fd1/*

说明:忽略目录 fd1 下的全部内容;注意,不管是根目录下的 /fd1/ 目录,还是某个子目录 /child/fd1/ 目录,都会被忽略;

b、规则:/fd1/*

说明:忽略根目录下的 /fd1/ 目录的全部内容;

c、规则:

/*

!.gitignore

!/fw/bin/

!/fw/sf/

说明:忽略全部内容,但是不忽略 .gitignore 文件、根目录下的 /fw/bin/ 和 /fw/sf/ 目录;

3、创建.gitignore文件

(1) 常规的windows操作

  • 根目录下创建gitignore.txt;
  • 编辑gitignore.txt,写下你的规则,例如加上node_modules/;
  • 打开命令行窗口,切换到根目录(可以直接在文件夹上面的地址栏输入cmd回车);
  • 执行命令ren gitignore.txt .gitignore。

(2) 用Git Bash

  • 根目录下右键选择“Git Bash Here”进入bash命令窗口;
  • 输入vim .gitignore或touch .gitignore命令,打开文件(没有文件会自动创建);
  • 按i键切换到编辑状态,输入规则,例如node_modules/,然后按Esc键退出编辑,输入:wq保存退出。

如图:

# dependencies  npm包文件
/node_modules
# production  打包文件
/build
# misc 
.DS_Store
npm-debug.log*

**DS_Store:**这个文件是Mac OS X用来存储文件夹的一些诸如自定义图标,ICON位置尺寸,窗口位置,显示列表种类以及一些像窗体自定义背景样式,颜色这样的元信息。默认情况下,Mac OS X下的每个文件夹下应该都会生成一个,包括网络介质存储盘和U盘这样的外部设备。

image.png

**npm-debug.log:**项目主目录下总是会出现这个文件,而且不止一个,原因是npm i 的时候,如果报错,就会增加一个此文件来显示报错信息,npm install的时候则不会出现。

最后需要强调的一点是,如果你不慎在创建.gitignore文件之前就push了项目,那么即使你在.gitignore文件中写入新的过滤规则,这些规则也不会起作用,Git仍然会对所有文件进行版本管理。

简单来说,出现这种问题的原因就是Git已经开始管理这些文件了,所以你无法再通过过滤规则过滤它们。因此一定要养成在项目开始就创建.gitignore文件的习惯,否则一旦push,处理起来会非常麻烦。

二、解决办法

找到.gitignore这个文件,把/dist这一项删掉。在重新提交git就可以了。

image.png


目录
相关文章
|
1月前
|
开发工具 git
如何操作github,gitee,gitcode三个git平台建立镜像仓库机制,这样便于维护项目只需要维护一个平台仓库地址的即可-优雅草央千澈
如何操作github,gitee,gitcode三个git平台建立镜像仓库机制,这样便于维护项目只需要维护一个平台仓库地址的即可-优雅草央千澈
183 69
如何操作github,gitee,gitcode三个git平台建立镜像仓库机制,这样便于维护项目只需要维护一个平台仓库地址的即可-优雅草央千澈
|
8天前
|
前端开发 JavaScript Java
【03】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架搭建-服务端-后台管理-整体搭建-优雅草卓伊凡商业项目实战
【03】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架搭建-服务端-后台管理-整体搭建-优雅草卓伊凡商业项目实战
53 13
【03】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架搭建-服务端-后台管理-整体搭建-优雅草卓伊凡商业项目实战
|
8天前
|
人工智能 JavaScript 关系型数据库
【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
55 14
【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
|
7天前
|
SQL JavaScript 安全
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
44 11
【04】Java+若依+vue.js技术栈实现钱包积分管理系统项目-若依框架二次开发准备工作-以及建立初步后端目录菜单列-优雅草卓伊凡商业项目实战
|
11天前
|
人工智能 JavaScript 安全
【01】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-需求改为思维导图-设计数据库-确定基础架构和设计-优雅草卓伊凡商业项目实战
【01】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-需求改为思维导图-设计数据库-确定基础架构和设计-优雅草卓伊凡商业项目实战
55 13
【01】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-需求改为思维导图-设计数据库-确定基础架构和设计-优雅草卓伊凡商业项目实战
|
4月前
|
JavaScript 容器
乾坤qiankun框架搭建 主应用为vue3的项目。
乾坤qiankun框架搭建 主应用为vue3的项目。
300 2
|
15天前
|
开发工具 git 索引
怎么取消对project.private.config.json这个文件的git记录
通过以上步骤,您可以成功取消对 `project.private.config.json`文件的Git记录。这样,文件将不会被包含在未来的提交中,同时仍保留在您的工作区中。
56 28
|
7天前
|
安全 开发工具 git
git分布式版本控制系统及在码云上创建项目并pull和push
通过本文的介绍,我们详细讲解了Git的基本概念和工作流程,并展示了如何在码云上创建项目及进行pull和push操作。Git作为一种分布式版本控制系统,为开发者提供了强大的工具来管理代码变更和协作开发。希望本文能帮助您更好地理解和使用Git及码云,提高开发效率和代码质量。
37 18
|
6天前
|
安全 开发工具 git
git分布式版本控制系统及在码云上创建项目并pull和push
通过本文的介绍,我们详细讲解了Git的基本概念和工作流程,并展示了如何在码云上创建项目及进行pull和push操作。Git作为一种分布式版本控制系统,为开发者提供了强大的工具来管理代码变更和协作开发。希望本文能帮助您更好地理解和使用Git及码云,提高开发效率和代码质量。
29 16
|
10天前
|
监控 JavaScript 前端开发
ry-vue-flowable-xg:震撼来袭!这款基于 Vue 和 Flowable 的企业级工程项目管理项目,你绝不能错过
基于 Vue 和 Flowable 的企业级工程项目管理平台,免费开源且高度定制化。它覆盖投标管理、进度控制、财务核算等全流程需求,提供流程设计、部署、监控和任务管理等功能,适用于企业办公、生产制造、金融服务等多个场景,助力企业提升效率与竞争力。
60 12

热门文章

最新文章