老项目维护--删除手动下载的js使用npm安装方案之一

背景：最近项目（vue项目）按照上级要求需要整改，所有第三方依赖只能是版本火车头中有的，而且为了便于维护和升级，所以要删除所有手动下载的js依赖，修改为使用npm安装的方式在项目中使用

在我们这个已经运行了三年的项目来说，由于前期需求爆发，管理比较混乱，还是存在手动引入的依赖，比如说ueditor、jquery等，存放目录为项目根目录的static下，而且存在很多地方在引用，如果需要修改的话，需要修改的文件比较多，而且需要去验证。为了节约时间和人力，在使用npm安装好相应依赖之后，使用gulp将nodemules下相应依赖中的文件复制到static中，其他地方不用修改，这样可以以最小风险进行整改。具体实现方案如下：

1、在项目中安装gulp

npm install --save-dev gulp

2、在项目根目录下创建gulpfile.js文件，名字千万不要写错！

3、在gulpfile.js中引入gulp，编写任务，举例：将node_modules中的vue依赖的vue.min.js复制到public文件夹下

const gulp=require("gulp")
gulp.task('copyVue',function(){
    return gulp.src('./node_modules/vue/dist/vue.min.js')
    .pipe(gulp.dest('./public/'))
})

4、寻找执行gulp任务的时机

我们想要的效果是，项目成员在下载代码之后，执行npm install安装依赖之后就要自动执行gulp任务，所以就用到了package.json文件中script去执行我们的脚本，具体使用的是install/ postinstall: Run AFTER the package is installed.

"scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint",
    "postinstall": "gulp copyVue"
},

TIME!