eslint

vue-cli 2.0创建步骤 PS D:\Web前端\vue项目\Clistudy> vue init webpack vue-cli-2.0 ? Project name vue-cli-2.0-study ? Project description vue cli 2.0 study-vue.js ? Author Keven Li ? Vue build standalone ? Install vue-router? Yes ? Use ESLint to lint your code? Yes ? Pick an ESLint preset Standard ? Set up unit tests No ? Setup e2e tests with Nightwatch? No ? Should we run `npm install` for you after the project has been created? (recommended) npm vue-cli 3.0创建步骤 PS D:\Web前端\vue项目\Clistudy> vue create vue-cli-3.0 Vue CLI v4.2.2 ? Please pick a preset: Manually select features ? Check the features needed

一、介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。有三个组件： CLI ： @vue/cli 全局安装的 npm 包，提供了终端里的vue命令（如：vue create 、vue serve 、vue ui 等命令） CLI 服务 ： @vue/cli-service 是一个开发环境依赖。构建于 webpack 和 webpack-dev-server 之上（提供 如： serve 、 build 和 inspect 命令） CLI 插件 ：给Vue 项目提供可选功能的 npm 包 （如： Babel/TypeScript 转译、ESLint 集成、unit和 e2e测试 等） 二、安装 1、全局安装过旧版本的 vue-cli (1.x 或 2.x)要先卸载它，否则跳过此步： 1 npm uninstall vue-cli -g // 或 yarn global remove vue-cli 　 2、Vue CLI 3需要 nodeJs ≥ 8.9 (官方推荐 8.11.0）。 下载安装nodeJs， 中文官方 下载地址： http://nodejs.cn/download/ 3、安装@vue/cli（Vue CLI 3的包名称由 vue-cli 改成了 @vue/cli ） 1 cnpm install -g @vue/cli //yarn global

关于NASA的10条编程规则，他们曾表示：这些规则的作用就像汽车上的安全带：最初，它们可能有点不舒服，但过了一会儿，它们的使用就变成了第二天性，而没有使用它们就变得不可想象。 Gerard J. Holzmann 10条规则的力量是由NASA / JPL可靠软件实验室的Gerard J. Holzmann于2006年创建的。这些规则旨在消除某些使代码难以查看或静态分析的C语言编程实践。 这些规则是对MISRA C规则的补充，并已合并到更大的JPL编码标准集中。 10条编码规则 1、避免使用复杂的流程构造，例如 goto 和 recursion 2、所有循环都必须有固定的边界（这可以防止代码错乱） 3、避免堆内存分配 4、将函数限制为单个打印页面 5、每个函数至少使用两个运行时断言 6、将数据的范围限制在尽可能小的范围内 7、检查所有非void函数的返回值，或将其强制转换为void以指示该返回值无用 8、谨慎使用预处理器 9、将指针使用限制为单引用，并且不使用函数指针 10、编译所有可能的警告活动;所有的警告都应该在软件发布之前解决 这些规则是为C语言定义的，但是其中一些规则也可以在现代Web或移动项目中使用。以下是我的挑选的部分适用规则，供大家参考。 #1.避免使用复杂的流程构造，例如Goto和递归 recursion 如果不需要执行简单任务 for 可以完成的任务

ESLint 是一个插件化的代码检测工具,官方介绍如下: The pluggable linting utility for JavaScript and JSX. 本文讲述一下ESLint的一些基本用法. 安装 1.全局安装 全局安装的 ESLint 能够用于所有的项目. 用 npm 进行安装: npm install -g eslint 安装完成后通过以下命令设置配置文件: eslint --init 在检测代码时运行以下命令: eslint file.js 2.本地安装 将 ESLint 作为项目构建的一部分. 用 npm 进行安装: npm install --save-dev eslint 设置配置文件: ./node_modules/.bin/eslint --init 在检测代码时运行以下命令: ./node_modules/.bin/eslint yourfile.js 注意:如果 ESLint 是全局安装的, 那它中间配置的插件也必须是全局安装的 当执行完 –init 后, 得到 .eslintrc 的配置文件, 文件中包含以下内容: 123456 { "rules": { "semi": ["error", "always"], "quotes": ["error", "double"] }} rules 表示用户自定义的规则,

Auto Close Tag 自动闭合HTML标签 Auto Rename Tag 修改HTML标签时，自动修改匹配的标签 Bookmarks 添加行书签 Can I Use HTML5、CSS3、SVG的浏览器兼容性检查 Code Runner 运行选中代码段（支持大量语言，包括Node） CodeBing 在VSCode中弹出浏览器并搜索，可编辑搜索引擎 Color Highlight 颜色值在代码中高亮显示 Color Picker 拾色器 Document This 注释文档生成 EditorConfig for VS Code EditorConfig 插件 Emoji 在代码中输入emoji ESLint ESLint插件，高亮提示 File Peek 根据路径字符串，快速定位到文件 Font-awesome codes for html FontAwesome提示代码段 ftp-sync 同步文件到ftp Git Blame 在状态栏显示当前行的Git信息 Git History(git log) 查看git log GitLens 显示文件最近的commit和作者，显示当前行commit信息 Guides 高亮缩进基准线 Gulp Snippets Gulp代码段 HTML CSS Class Completion CSS class提示 HTML CSS

1、error Unary operator ‘++’ used no-plusplus ESLint认为一元操作符，是不安全的，所以禁止使用 确书写方式（ESLint格式） for循环的正确姿势如下 for (i = 0; i < l; i += 1) { return; } 2、eslint error ‘data’ is missing in props validation 缺少propTypes定义 修改方法：添加propTypes定义 DemoName代指你的类名，groupInfo是你类中用到的参数对象 DemoName.propTypes = { groupInfo: { memberInfo: PropTypes.array || [], needCount: PropTypes.number || 0 } } 3、error Do not use Array index in keys ESlint 不支持用数组的循环索引做为keys 解决方法：可以做value里的id或者将索引key转换为字符串类型 例如： key={index.toString()} 4、error ‘Component’ should be written as a pure function stateless-function 错误“组件”应写为纯函数无状态函数 解决方法

配置： 1，安装依赖 sudo tnpm install eslint -g sudo tnpm install eslint-plugin-import -g sudo tnpm install eslint-config-airbnb -g sudo tnpm install eslint-plugin-jsx-a11y -g sudo tnpm install eslint-plugin-react -g sudo tnpm install babel-eslint -g 2，将配置的eslintrc.js 文件放在工程目录下（扫描所在目录下所有js文件），注意：修改文件名为.eslintrc.js 3，配置idea路径 规则详情参考： http://www.jianshu.com/p/1682b91756b1 eslintrc.js 文件 module.exports = { "env": { "browser": true, "node": true }, "globals": { "appTool": true, "require": true, "$": true, "ant": true }, "extends": "eslint-config-airbnb", "parser": "babel-eslint", "rules": { "accessor-pairs