转载自:https://www.cnblogs.com/ye-hcj/p/7074363.html

本文介绍vue-cli脚手架build目录中check-versions.js的配置

  1. 本文件是用来检测node和npm版本的
  2. 直接上代码加注释

  

  1. // 下面的插件是chalk插件,他的作用是在控制台中输出不同的颜色的字,大致这样用chalk.blue('Hello world'),这款插件只能改变命令行中的字体颜色
    var chalk = require('chalk')
    // 下面这个是semver插件,是用来对特定的版本号做判断的,
    比如 // semver.gt('1.2.3','9.8.7') false 1.2.3版本比9.8.7版本低
    // semver.satisfies('1.2.3','1.x || >=2.5.0 || 5.0.0 - 7.2.3') true 1.2.3的版本符合后面的规则
  2. var semver = require('semver')
    // 下面是导入package.json文件,要使用里面的engines选项,要注意require是直接可以导入json文件的,并且requrie返回的就是json对象
  3. var packageConfig = require('../package.json')
    // 下面这个插件是shelljs,作用是用来执行Unix系统命令
  4. var shell = require('shelljs')
    // 下面涉及了很多Unix命令,这里可能解释的不够详细,第一时间精力有限,第二能力有限。。。
  5. function exec (cmd) {
    //脚本可以通过 child_process 模块新建子进程,从而执行 Unix 系统命令
    //下面这段代码实际就是把cmd这个参数传递的值转化成前后没有空格的字符串,也就是版本号
    //https://nodejs.org/api/child_process.html这是nodejs的子进程教程
    //require('child_process') node的模块,execSync(cmd)创建同步进程
  6. return require('child_process').execSync(cmd).toString().trim()
  7. }
  8.  
  9. var versionRequirements = [
  10. {
  11. name: 'node',// node版本的信息
  12. currentVersion: semver.clean(process.version),// 使用semver插件吧版本信息转化成规定格式,也就是 ' =v1.2.3 ' -> '1.2.3' 这种功能
  13. versionRequirement: packageConfig.engines.node// 这是规定的pakage.json中engines选项的node版本信息 "node":">= 4.0.0"
  14. },
  15. ]
  16. /*shell.which('npm')  返回:C:\PROGRAM FILES\NODEJS\NPM.CMD 返回绝对路径,否则返回null*/
  17. if (shell.which('npm')) {
  18. versionRequirements.push({
  19. name: 'npm',
  20. currentVersion: exec('npm --version'),  // 自动调用npm --version命令,并且把参数返回给exec函数,从而获取纯净的版本号
  21. versionRequirement: packageConfig.engines.npm // 这是规定的pakage.json中engines选项的node版本信息 "npm": ">= 3.0.0"
  22. })
  23. }
  24.  
  25. module.exports = function () {
  26. var warnings = []
  27. for (var i = 0; i < versionRequirements.length; i++) {
  28. var mod = versionRequirements[i]
  29. if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
      //上面这个判断就是如果版本号不符合package.json文件中指定的版本号,就执行下面的代码
  30. warnings.push(mod.name + ': ' +
  31. chalk.red(mod.currentVersion) + ' should be ' +
  32. chalk.green(mod.versionRequirement)
        // 大致意思就是 把当前版本号用红色字体 符合要求的版本号用绿色字体 给用户提示具体合适的版本
  33. )
  34. }
  35. }
  36.  
  37. if (warnings.length) {
  38. console.log('')
  39. console.log(chalk.yellow('To use this template, you must update following to modules:'))
  40. console.log()
  41. for (var i = 0; i < warnings.length; i++) {
  42. var warning = warnings[i]
  43. console.log(' ' + warning)
  44. }
  45. console.log()
  46. process.exit(1)
    // 提示用户更新版本,具体不解释了,应该能看懂
  47. }
  48. }

11

vue-cli脚手架build目录中check-versions.js的配置的更多相关文章

  1. vue-cli脚手架build目录中的dev-server.js配置文件

    本文系统讲解vue-cli脚手架build目录中的dev-server.js配置文件 这个配置文件是命令npm run dev 和 npm run start 的入口配置文件,主要用于开发环境 由于这 ...

  2. vue-cli 2.x脚手架build目录中的webpack.base.conf.js配置文件

    此文章用来解释vue-cli脚手架build目录中的webpack.base.conf.js配置文件,适用于vue-cli 2.x版本 此配置文件是vue开发环境的wepack相关配置文件,主要用来处 ...

  3. vue-cli脚手架build目录中的webpack.dev.conf.js配置文件

    此文章用来解释vue-cli脚手架build目录中的webpack.dev.conf.js配置文件 此配置文件是vue开发环境的wepack相关配置文件 关于注释 当涉及到较复杂的解释我将通过标识的方 ...

  4. vue-cli脚手架build目录中的build.js配置文件

    该随笔收藏自: vue-cli脚手架build目录中的build.js配置文件 这个配置文件是命令npm run build 的入口配置文件,主要用于生产环境 由于这是一个系统的配置文件,将涉及很多的 ...

  5. vue-cli脚手架build目录中的karma.conf.js配置文件

    本文系统讲解vue-cli脚手架build目录中的karma.conf.js配置文件 这个配置文件是命令 npm run unit 的入口配置文件,主要用于单元测试 这条命令的内容如下 "c ...

  6. vue-cli脚手架build目录中的webpack.prod.conf.js配置文件

    // 下面是引入nodejs的路径模块 var path = require('path') // 下面是utils工具配置文件,主要用来处理css类文件的loader var utils = req ...

  7. vue-cli脚手架build目录中的webpack.base.conf.js配置文件

    转载自:http://www.cnblogs.com/ye-hcj/p/7082620.html webpack.base.conf.js配置文件// 引入nodejs路径模块 var path = ...

  8. vue-cli脚手架build目录下utils.js工具配置文件详解

    此文章用来解释vue-cli脚手架build目录中的utils.js配置文件 此配置文件是vue开发环境的wepack相关配置文件,主要用来处理css-loader和vue-style-loader ...

  9. 13. Vue CLI脚手架

    一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...

随机推荐

  1. Visual Studio中“后期生成事件命令行” 中使用XCopy命令

    将程序所依赖的动态库与其他依赖文件做了分类,使用XCopy命令自动生成相应的目录结构. set source="$(TargetDir)" set output="$(S ...

  2. web中用纯CSS实现筛选菜单

    web中用纯CSS实现筛选菜单 本文我们来用纯css实现像淘宝宝贝筛选菜单那样的效果,例子虽然没有淘宝那样强大,不过原理差不多,如果花点心思也可以实现和淘宝一样的. 内容过滤是一个在Web上常见的一个 ...

  3. MFC绘图相关GDI工具对象和函数介绍

    在利用MFC进行界面编程时,除了需要熟悉各种类型控件的操作外,还会经常遇到图形绘制和显示的问题,比如时频分析界面.图像处理界面等.处理这些软件界面开发问题时,不可避免地需要用到一系列GDI工具对象和相 ...

  4. 无状态会话Bean、有状态会话Bean、CMP与BMP中,哪一种Bean不需要自己书写连接数据库的代码?

    无状态会话Bean.有状态会话Bean.CMP与BMP中,哪一种Bean不需要自己书写连接数据库的代码? A.无状态会话Bean B.有状态会话Bean C.CMP D.BMP 解答:C

  5. Mac OSX使用隐藏文件夹

    直接修改文件夹名字,前面加个"." 小圆点就隐藏了,下去进入可以在finder图标右键点菜单“前往文件夹...",输入你文件夹的路径即可

  6. java web 登录框

    我们会骂 12306 的网站界面挫,效果差,速度慢,回头看看自己写的代码,是不是也一样的狗血!在前端,很多看似简单的东西,内藏无数玄机.本文将以一个小小的登录框为入口,谈一谈如何完善自己的程序. 在很 ...

  7. Chem 3D模型的参数值更改方法

    在化学绘图软件ChemOffice 15.1中有个专门用于绘制三维结构的组件,就是Chem 3D.通过这个组件用户可以绘制3D模型并可以通过这个组件来计算一些化学数据.在使用Chem 3D组件过程中, ...

  8. asscert断言的几种方法

    一.什么是断言 执行完测试用例后,最后一步是判断测试结果是通过还是失败,在自动化脚本中一般把这种生成测试结果的方法叫做断言 它用来检查一个条件,如果它为真,则不做任何事,如果它为假,则会跑出Asser ...

  9. 下载VMware

    1.进入VMware官网:http://www.vmware.com/cn 2.找到下载,点击Workstation Pro,此时需要账号登录. 3.选择需要下载的版本.对应的操作系统,点击转至下载

  10. java-通过 HashMap、HashSet 的源码分析其 Hash 存储机制

    通过 HashMap.HashSet 的源码分析其 Hash 存储机制 集合和引用 就像引用类型的数组一样,当我们把 Java 对象放入数组之时,并非真正的把 Java 对象放入数组中.仅仅是把对象的 ...