一、WebStorm 2019.2

WebStorm 2019.2 添加了新的检查项，允许在项目中查找重复代码。该检查在默认情况下启用，检查是动态的，且会立即在编辑器中高亮可能的重复项。它适用于 JavaScript、TypeScript、CSS、Sass、SCSS 和 Less。https://www.oschina.net/news/107486/webstorm-2019-2-eap-3-released https://www.oschina.net/p/webstorm

二、jscpd

（一）、项目GitHub地址及原理

https://github.com/kucherenko/jscpd
采用Rabin-Karp算法

（二）、优点

1、支持.css、.js、.vue、.xml等文件类型；
2、输出结果清晰明了
3、作者还在持续更新优化

（三）、使用步骤

1、npm install -g jscpd
2、在项目根目录放置.jscpd.json，该项目中代码如下：

{
  "threshold": 0.1,
  "reporters": ["html", "console"],
  "ignore": ["dist/**", "dest/**"
  , "neurons/**"
  , "node_modules/**"
  , "test/**"
  , "data/**"
  , "css/**"
  , "entries/**"
  ],
  "absolute": true
}

3、在项目根目录下执行 jscpd ./src/* （意指检测src下的所有文件）

4、在项目根目录里的 report/jscpd-report.html 可以查看结果：

image.png

三、jsinspect

（一）、项目GitHub地址 及原理

https://github.com/danielstjules/jsinspect
根据抽象语法树 AST节点类型来识别相似代码；

（二）、缺点

1、仅支持.jsx、.js文件类型；
2、库从17年后作者不再更新
3、展示的结果不是很友好

（三）、使用步骤

1、npm install -g jsinspect
2、在项目根目录放置.jsinspectrc，该项目中代码如下：

{
  "threshold":     30,
  "identifiers":   true,
  "literals":      true,
  "color":         true,
  "minInstances":  2,
  "ignore":        "test|spec|mock|notchange",
  "truncate":      100
    }

3、在项目根目录下执行 jsinspect ./workspace/ （意指检测workspace下的所有文件）

4、命令行可以查看结果：

image.png