Использование wml для отладки модуля npm действительно приятно

Node.js
Использование wml для отладки модуля npm действительно приятно

Разработка модулей интерфейса стала стандартом разработки. Одно из больших удобств разработки модулей заключается в том, что они позволяют нам повторно использовать код на разных страницах и даже в приложениях. Когда мы повторно используем модули в приложениях, нам нужно использовать npm для публикации модулей для различных системных вызовов. Представленный сегодня wml — мощный инструмент для отладки модулей.

что такое вмл

wml прослушивает изменения в папке (используяWatchman) и скопируйте измененные файлы в другую папку.

wml — это инструмент командной строки, который работает очень похоже на ln -s. Во-первых, используйтеwml addКоманда устанавливает ссылку, затем запускает службу wml (wml start), чтобы начать слушать. Это все!

Зачем использовать wml

Посмотрим правде в глаза, иногда символических ссылок недостаточно. На Github более10 000о"support for symlinks".

Два примера, с которыми я столкнулся до сих пор: Менеджер пакетов React NativeОтсутствует поддержка символических ссылоки веб-пакетinability to find linked modules dependencies. Путь многих людей состоит в том, чтобы напрямую изменитьnode_modulesпапку, но это создает много проблем:

  1. Плохо, когда от твоего модуля одновременно зависят два проекта.
  2. при случайном выполненииnpm install, и снова облажался
  3. Это просто неправильно

wml использует сверхбыстрый Watchman Facebook, чтобы отслеживать изменения в исходной папке и копировать их (и только копировать) в папку назначения.

установить сторожа

Чтобы позволитьwml startДля работы необходимо выполнить следующие команды:

# npmGlobalPrefix 可以通过 `npm prefix -g` 获取
$ watchman watch ${npmGlobalPrefix}\node_modules\wml\src
# 一定要重启电脑让配置生效！

Установить

$ npm install -g wml

WML-команда

  • wml add|a <src> <dest>: добавить ссылку
  • wml start|s: включить wml
  • wml list|ls: показать все ссылки
  • wml rm <linkId>: удалить ссылку, пройтиallВсе ссылки можно удалить
  • wml enable|e: включить передачу по ссылкеallВключить все ссылки одним щелчком мыши
  • wml disable|d: отключить ссылку, пройтиallОтключить все ссылки одним щелчком мыши
  • watchman watch-del-all: Исправлять.watchmanconfigПосле этого нужно очистить кеш сторожа

Лучшие практики

npm scripts

Это моя привычка, написание скриптов может повысить эффективность работы:

{
  "scripts": {
    "dev": "wml start",
    // yarn wml:add <dest>
    "wml:add": "wml add ./",
    // 修改 `.watchmanconfig` 之后需要清空 watchman 缓存
    "wml:clean":"watchman watch-del-all",
  },
}

демо в модуле

Также часто вы можете поместить демонстрационный проект в проект модуля, чтобы продемонстрировать свой модуль. Нам нужно сделать некоторую настройку:

1. Измените package.json

{
  "name": "zhiliao",
  "scripts": {
    "dev": "wml start",
    "wml:add": "wml add ./ ./Example/node_modules/zhiliao/",
    // 修改 `.watchmanconfig` 之后需要清空 watchman 缓存
    "wml:clean":"watchman watch-del-all",
  },
}

2. Настройте файл .watchmanconfig, чтобы он игнорировал папку примеров.

{
  "ignore_dirs": [
    ".git",
    "node_modules",
    "yarn-error.log",
    "yarn.lock",
    "README.md",
    "Example"
  ]
}

Эта статья была впервые опубликована вБлог Ян Цзюньнина, Творить непросто, лайк 👍 - моя мотивация продолжать! ! !

Категории