手撕vue-cli配置文件——check-versions.js篇
check-versions.js,vue-cli中检查版本的js文件。
'use strict'
const chalk = require('chalk')
const semver = require('semver')
const packageConfig = require('../package.json')
const shell = require('shelljs')
function exec (cmd) {
return require('child_process').execSync(cmd).toString().trim()
} const versionRequirements = [
{
name: 'node',
currentVersion: semver.clean(process.version),
versionRequirement: packageConfig.engines.node
}
] if (shell.which('npm')) {
versionRequirements.push({
name: 'npm',
currentVersion: exec('npm --version'),
versionRequirement: packageConfig.engines.npm
})
} module.exports = function () {
const warnings = []
for (let i = 0; i < versionRequirements.length; i++) {
const mod = versionRequirements[i]
if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
warnings.push(mod.name + ': ' +
chalk.red(mod.currentVersion) + ' should be ' +
chalk.green(mod.versionRequirement)
)
}
} if (warnings.length) {
console.log('')
console.log(chalk.yellow('To use this template, you must update following to modules:'))
console.log()
for (let i = 0; i < warnings.length; i++) {
const warning = warnings[i]
console.log(' ' + warning)
}
console.log()
process.exit(1)
}
}
semver.valid('1.2.3') // '1.2.3',返回符合版本格式的版本
semver.valid('a.b.c') // null,如果不符合版本返回null
semver.clean(' =v1.2.3 ') // '1.2.3',返回一个标准的版本号,且去掉两边的空格
semver.satisfies('1.2.3', '1.x || >=2.5.0 || 5.0.0 - 7.2.3') // true,第一个参数是测试的版本号,第二个参数是匹配的版本,如果匹配则返回true
semver.gt('1.2.3', '9.8.7') // false,第一个参数的版本是否比第二个大
semver.lt('1.2.3', '9.8.7') // true ,第一个参数的版本您是否比第二个小
//这块儿不太熟,大致意思是用js代码同步执行一个cmd的命令,并且对返回的结果执行toString()和trim()方法
function exec (cmd) {
return require('child_process').execSync(cmd).toString().trim()
}
const versionRequirements = [
{
name: 'node',
currentVersion: semver.clean(process.version),
versionRequirement: packageConfig.engines.node
}
]
if (shell.which('npm')) {
versionRequirements.push({
name: 'npm',
currentVersion: exec('npm --version'),
versionRequirement: packageConfig.engines.npm
})
}
shelljs的which方法是去系统的路径(system's PATH)中寻找命令,shell.which('npm')就是寻找npm命令,exec()方法就是上面说的执行一个命令(在这里是执行npm --version),返回版本信息的函数。关于shelljs更多的东西可以看这里:
http://www.ruanyifeng.com/blog/2015/05/command-line-with-node.html
https://www.npmjs.com/package/shelljs
module.exports = function () {
const warnings = []
for (let i = 0; i < versionRequirements.length; i++) {
const mod = versionRequirements[i]
if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {
warnings.push(mod.name + ': ' +
chalk.red(mod.currentVersion) + ' should be ' +
chalk.green(mod.versionRequirement)
)
}
}
if (warnings.length) {
console.log('')
console.log(chalk.yellow('To use this template, you must update following to modules:'))
console.log()
for (let i = 0; i < warnings.length; i++) {
const warning = warnings[i]
console.log(' ' + warning)
}
console.log()
process.exit(1)
}
}
这部分代码就很好理解了,分别检测当前的npm和node版本是不是符合package.json中定义的,如果不符合就提示wraning。
手撕vue-cli配置文件——check-versions.js篇的更多相关文章
- 手撕vue-cli配置——webpack.base.conf.js篇
在开始写webpack.base.conf.js(简称base)之前,我们先来看一下vue-loader.conf.js这个文件,毕竟在base中我们还会用到: 'use strict' //引入前一 ...
- 手撕vue-cli配置——webpack.prod.conf.js篇
'use strict' const path = require('path') const utils = require('./utils') const webpack = require(' ...
- 手撕vue-cli配置——webpack.dev.conf.js篇
const utils = require('./utils') const webpack = require('webpack') const config = require('../confi ...
- vue/cli项目添加外部js文件的一个方法
有一个util.js文件,内容如下 function Util () { ... } export default new Util() 可以在main.js里面通过import引入js import ...
- Vue CLI 3 如何自定义 js 的文件名
参考链接:https://blog.csdn.net/weixin_33979363/article/details/88742342
- [转]Vue CLI 3搭建vue+vuex 最全分析
原文地址:https://my.oschina.net/wangnian/blog/2051369 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@ ...
- Vue CLI 3搭建vue+vuex 最全分析
一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cli 全局安装的 npm 包,提供了终端里的vue命令(如:vue create .vue ...
- Configuration Reference In Vue CLI 3.0
Configuration Reference This project is sponsored by #Global CLI Config Some global configurations ...
- 面试中的MySQL主从复制|手撕MySQL|对线面试官
关注微信公众号[程序员白泽],进入白泽的知识分享星球 前言 作为<手撕MySQL>系列的第三篇文章,今天讲解使用bin log实现主从复制的功能.主从复制也是MySQL集群实现高可用.数据 ...
- Vue Cli 3:vue.config.js配置文件
Vue Cli 3生成的项目结构,没有build.config目录,而是使用vue.config.js来进行配置. vue.config.js 是一个可选的配置文件,如果项目的 (和 package. ...
随机推荐
- Qt Package Project 打包发布程序
在Qt项目开发完成后,我们想将项目打包发布成一个可执行文件,需要做如下步骤: 首先,将项目中的release文件中的可执行文件拷到一个新建的文件夹中,例如project.exe,用Qt自带的生成必备的 ...
- 服务端渲染(ssr)初了解
之前接触的比较多的是SPA单页面应用,前端路由渲染,对于node服务端渲染刚开始了解到,服务端渲染的话相对于SPA来说有助于SEO优化,首屏加载更快. 和之前的SPA项目不同,之前公司spa的发布部署 ...
- 170810、spring+springmvc+Interceptor+jwt+redis实现sso单点登录
在分布式环境中,如何支持PC.APP(ios.android)等多端的会话共享,这也是所有公司都需要的解决方案,用传统的session方式来解决,我想已经out了,我们是否可以找一个通用的方案,比如用 ...
- Flask 学习篇二:学习Flask过程中的记录
Flask学习笔记: GitHub上面的Flask实践项目 https://github.com/SilentCC/FlaskWeb 1.Application and Request Context ...
- This version of the rendering library is more recent than your version of ADT plug-in. Please update ADT plug-in
地址:http://stackoverflow.com/questions/18852983/eclipse-reports-rendering-library-more-recent-than-ad ...
- jdb--gdb---java 远程调试(java application与web application)
命令比较 gdb jdb bt where del clear stop brea ...
- php 实现栈结构
一.栈的定义及知识 1.定义:栈又称为栈或者堆叠,是计算机科学中的一种特殊的串列形式的抽象数据类型,特殊之处在于只允许在链表或者数组的一端(堆栈顶端指针,又称 "top")加入数据 ...
- Spring Boot打war包
然后修改下入口: 这样程序既可以以war也可以以jar的形式run. 右键项目properties,找到项目位置,然后: 然后放到tomcat的webapps的目录下: 然后启动tomcat:star ...
- Qt计算器开发(三):执行效果及项目总结
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/guodongxiaren/article/details/26046543 执行效果 project ...
- java项目连接jdbc报错:com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Could not create connection to database server
java项目连接jdbc报错:com.mysql.jdbc.exceptions.jdbc4.MySQLNonTransientConnectionException: Could not creat ...