问题及背景
最近在现有Vue2项目中引入VuePress文档工具,编写基于ElementUI的组件文档。结果出现了诡异的”Error from chokidar (D:\): Error: EBUSY: resource busy or locked, lstat 'D:\pagefile.sys'报错。
从报错信息看不出任何有帮助的提示,参考网上的方法删除重装node_modules,问题依旧。
初始代码:
// enhanceApp.js import 'element-ui/lib/theme-chalk/index.css'; import ElementUI from 'element-ui';
//import { Button } from 'element-ui'; // 单独引入同样报错
export default async ({ Vue }) => { Vue.use(ElementUI, {size: 'mini'}); }
报错信息:
success [14:16:24] Build 59369a finished in 4897 ms! > VuePress dev server listening at http://localhost:8080/ Error from chokidar (D:\): Error: EBUSY: resource busy or locked, lstat 'D:\pagefile.sys'
问题排查
尝试将文档独立为一个新项目,则没有问题。于是考虑是依赖冲突问题,但具体是哪个依赖则不得而知。
于是只能排除法一个个组件测试。
// enhanceApp.js import Alert from 'element-ui/lib/alert.js'; import Aside from 'element-ui/lib/aside.js'; import Autocomplete from 'element-ui/lib/autocomplete.js'; import Avatar from 'element-ui/lib/avatar.js'; import Backtop from 'element-ui/lib/backtop.js'; //中间省略。。 import Backtop from 'element-ui/lib/upload.js';
最终发现在引入 “form-item.js”组件时问题出现,其它组件则没有问题。
于是深入form-item代码内部继续排查,同时联想之前看过的文章,确定了冲突的依赖“async-validator”。
/***/ 49: /***/ (function(module, exports) { module.exports = require("async-validator"); /***/ }),
从elementUI看到依赖版本为1.8.1
"dependencies": { "async-validator": "~1.8.1", //省略 }
在项目中将其指定到1.11即可,至此问题解决。可以愉快地完整引用elementui了。
// 项目package.json "dependencies": { "async-validator": "^1.11.5"", }
总结
排除法找到有问题的依赖为"async-validator",通过指定为高版本即可解决问题。但之前的报错信息跟问题原因看起来简直毫无关系,不得不提醒大家注意保持平常心,这非常重要。:)