关于前端自动化，打包的疑惑

Question

一直搞不懂前端自动化，打包，部署代码这种概念；工具学了几种，但就是串不起来，举个例子：我写的代码目录：还停留在新建个HTML插点图片css代码的阶段；但是clone下来直接双击就能运行————但是别人家的代码一般是这样的：clone下来要 npm install，npm run build一下才能跑，而且有那种.gitignore .babelrc package.json这种配置文件。js里的写法也是import Vue from 'vue'import App from './App.vue'import helpers from './helpers'类似这样模块化的写法。我就不知道怎么搞，我学了一点gulp会用它来编译一下sass，也会 npm init 但是不知道package.json怎么写。网上看了几篇教程也是教人怎么用工具的，没细说。哪里有系统一点的前端自动化教程呢？或者求告诉一下搜索的关键字，谢谢！