react-native的组件化不可或缺的wml热重载的用法

本文链接：https://blog.youkuaiyun.com/develop_csdn/article/details/121207848

本文介绍了组件化热重载工具wml的安装、配置及使用方法，用于实时同步文件变化。在使用过程中遇到了无法解析根目录的错误，通过wmlls和wmlrm命令解决了问题。建议在不再使用wml时清除记录，避免启动错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

组件化不可获取的热重载：wml

wml可以监控一个目录下的文件变化，自动将该目录同步到另一个目录

安装:

yarn global add wml

配置:

wml add 组件文件夹名 主工程名/node_modules/组件文件夹名

开启：

wml start

查看：

wml ls

删除：

wml rm [id]

清除所有缓存:

watchman watch-del-all
wml rm all

在组件文件夹中添加忽略监听的文件：

{
  "ignore_dirs": [
    ".git",
    "node_modules"
  ]
}

期间遇到一个问题：

[error] unable to resolve root /Users/xxxxx/Desktop/ios/demo/ios/demo1: directory /Users/xxxxx/Desktop/ios/demo/ios/demo1 is not watched
/Users/xxxxx/.config/yarn/global/node_modules/q/q.js:155
                throw e;
                ^

Error: unable to resolve root /Users/xxxxx/Desktop/ios/demo/ios/demo1: directory /Users/xxxxx/Desktop/ios/demo/ios/demo1 is not watched
    at BunserBuf.<anonymous> (/Users/xxxxx/.config/yarn/global/node_modules/fb-watchman/index.js:95:23)
    at BunserBuf.emit (events.js:210:5)
    at BunserBuf.process (/Users/xxxxx/.config/yarn/global/node_modules/bser/index.js:289:10)
    at /Users/xxxxx/.config/yarn/global/node_modules/bser/index.js:244:12
    at processTicksAndRejections (internal/process/task_queues.js:75:11) {
  watchmanResponse: {
    error: 'unable to resolve root /Users/xxxxx/Desktop/ios/demo/ios/demo1: directory /Users/xxxxx/Desktop/ios/demo/ios/demo1 is not watched',
    version: '4.9.0'
  }
}

应该是我之前设置了几个wml add xxx，然后wml会记录下，相当于缓存，然后把demo文件夹删除了，在wml start启动的时候找不到对应的监听文件夹，然后就报了上述错误。后面经过wml ls查看，删除了对应的id，在启动就好了，所以再用不到的时候最好删除记录，防止再次启动错误产生