Mac & Dropboxユーザーな開発者の皆さまこんにちは。突然ですが、node_modules の呪いに悩まされていませんか？いますよね？ですよね！気づいたら100,000ファイル同期中とかなってて焦りますよね！なんとかこの node_modules フォルダを同期しないようにできないもんですかね。しかもカンタンに。
というわけで今回は node_modules フォルダを同期させない簡単な方法をご紹介します。また、ワンクリックで同期を無効にできるAutomatorワークフローも配布します。ぜひ最後まで読んでみてください。よろしくどうぞ。
Dropbox node_modules同期問題から解放される！
Dropboxの同期無視のしくみについての理解が深まる
Macの新機能 File Providerについての理解が深まる
ワンクリックでnode_modulesを同期無視できるAutomatorワークフローをゲットできる！
node_modules を同期から除外できないものか…
.gitignore みたいなノリで、node_modules をDropboxの同期から除外できないもんですかねぇ。というのはもうかれこれ何年も悩まされてきたものですが、いろいろと考えた末に、現在僕が使っている、できるだけ労力を使わずに実現するための方法をご紹介します。
はじめに。選択型同期ではうまくいかない件
Dropboxのベーシックな機能に「選択型同期」というのがあります。これを使えば node_modules を無視できそうな気がしますが、残念ながらそうは問屋が下ろさないのです。
選択型同期とは、噛み砕いて言うと
Dropboxにすでにアップロードされているファイルやフォルダを、このデバイス（Mac / PC）には表示させない（同期しない）
という性質の機能。しかし、今回やりたいことは
そもそも node_modules フォルダの中身一切をDropboxにアップロードしたくない
という話です。なんせ100,000ファイルとか平気でイっちゃうので…。そんなもんDropboxにアップロードしたくないし、そもそも同期する必要もない性質のものです。
実はDropboxにはファイルやフォルダを無視する機能が用意されている…！
というわけで、選択型同期ではなく別の方法を使う必要があります。実はDropboxにはファイルやフォルダを「無視」するための機能が用意されているのです。下のの公式サイトに詳しく書いてあります。
2023/6/7: 上記公式サイトのMacのコマンドラインに若干の間違いがあります。当ページの修正版をお試しください。
Dropboxのフォルダを無視するためのコマンドライン
下記で紹介するコマンドをターミナルアプリで実行します。それぞれ [filename] には対象ファイル・フォルダ名に書き換えてください。絶対パスでも相対パスでもOK。
またここではMacのコマンドのみ紹介します。WindowsやLinuxのコマンドはサイトを確認ください。
macOS 12.5以降 & Dropbox for macOSを使っている場合
ファイルの同期を無視する
xattr -w 'com.apple.fileprovider.ignore#P' 1 [filename]ファイルの同期無視を解除する
xattr -d 'com.apple.fileprovider.ignore#P' [filename]macOS 12.3以前のMac
ファイルの同期を無視する
xattr -w com.dropbox.ignored 1 [filename]ファイルの同期無視を解除する
xattr -d com.dropbox.ignored [filename]コマンドラインを使って実際に同期無視をやってみる
ここではmacOS 13.1 Ventura & 新しいDropbox for macOSを例にして解説していきます。
さて、実際にやってみます。Dropboxフォルダ直下にプロジェクトフォルダのテイの「test」フォルダを作成。その中に空の node_modules フォルダを作成しておきます。
npm install をする前に空のnode_modules フォルダを自分で作っておくことで、一時的に node_modules が同期されてしまうのを回避できます
ターミナルでコマンドを入力します。testフォルダに移動して、直下の node_modules を同期無視します。
$ cd ~/Dropbox/test
$ xattr -w 'com.apple.fileprovider.ignore#P' 1 node_modulesコマンドを実行すると、node_modules のフォルダの横のアイコンが、雲に斜線が入ったアイコンに変わりました。これが、同期無視状態になったという目印です。
あとはもう npm install し放題！node_modules の中身は一切Dropboxに同期されません。スッキリ！
macOS 12.5以降実装されたFile Providerについてちょっと解説
Macの新機能 File Provider
常に新しいOSを使っている方はすでにお気づきかもしれませんが、新しいmacOSにはFile Providerという機能が実装されています。
これは、Dropboxだけではなく、OneDriveやGoogle DriveなどのオンラインストレージとMacのFinderの連携をMac側の機能として標準化し統一させたもの。
これまでは、DropboxはDropbox、OneDriveはOneDrive側で実装された独自機能によってMacと連携されていました。
なので、機能や同期ステータスのアイコンなどもそれぞれ独自で用意されたものでした。この同期機能の一切をmacOS側で準備することで機能を標準化し、さまざまなクラウドストレージを同じ使い勝手で使えるようになった、というあんばい。
File Providerには同期無視機能が搭載されている！
ここで、先ほどのコマンドラインの中身をもう一度見てみましょう。
こちらはmacOS 12.5以降、つまりFile Provider搭載MacのDropbox同期無視コマンド。
xattr -w 'com.apple.fileprovider.ignore#P' 1 [filename]こちらはmacOS 12.3以前、つまりFile Provider非搭載のMacのDropbox同期無視コマンド。
xattr -w com.dropbox.ignored 1 [filename]違いが分かりますかね。はいそうです。File Providerの方には com.apple.fileprovider と書いてあります。つまりAppleが用意した機能ということを示しています。つまり、MacのFile Provider側で実装されている無視機能を利用する、ということ。
対して下の方は com.dropbox.ignored とあります。これはDropbox側が用意した機能であることを示しています。
つまり。下のコマンドはDropbox専用であるのに対し、上のコマンドはDropboxに限らずOneDriveやGoogle Driveにも同様に適用できるということなのです！
もうひとつ。File Providerによって、DropboxもOneDriveも、ファイルの同期ステータスを示すアイコンがすべて統一されています。
これらはmacOSのFile Providerによって統一化されたことによる恩恵です。便利になりました。はい。
macOS 12.5以降のFile Providerはさまざまなクラウドストレージとの連携機能を標準化し統一するMac側の機能
新しいDropboxではFile Provider側の機能を利用して同期無視を実現できる
つまりOneDriveなど他のクラウドストレージでも同様の同期無視コマンドが使える！
node_modulesの同期無視をAutomatorで自動化して楽しよう
さて、コマンドラインの話に戻りますが、正直こんなコマンドを毎回打ってられないのは当然で、ここはAutomatorを使って自動化しちゃいましょう。
Automatorとは、Macのさまざまなアクションを自動化するためのプログラムを自作できるアプリケーションです。こちらを使って自作サービスを作ります。
Automatorを起動し、「クイックアクション」を選択。
下の画像を参考に、左上の検索で「シェル」と入力、出てきた「シェルスクリプトを実行」をダブルクリックすると右側に登録されます。あとは、画像の赤枠のとおり設定しましょう。終わったら「同期を無視」とでも名前をつけて保存すればOK。
シェルスクリプトの内容はこちらをコピペしてください。
for f in "$@"
do
xattr -w "com.apple.fileprovider.ignore#P" 1 "$f"
doneAutomatorワークフローのインストール場所
ワークフローを保存すると、おそらく下記の場所に保存されると思います。Finderがアクティブな状態で command + shift + G で下記をコピペするとこのフォルダを開くことができます。
~/Library/Services
ここ以外の場所にある場合は、workflowファイルをダブルクリックすると、ファイルがこのフォルダに移動（インストール）します。
この同期無視ワークフローの使い方
インストールできたらさっそく使ってみましょう。
Dropbox直下に test2 フォルダを、さらにその直下に空の node_modules フォルダを作っておきます。
この node_modules フォルダを副ボタンクリック -> クイックアクションに、今作った「同期を無視」がありますね。こいつをクリックして実行しましょう。
アイコンが雲スラッシュになったら同期無視成功です。これで簡単にnode_modules を無視できるようになりました！
大事なことなのでもう一度言っておきますが、npm install する前に空の node_modules フォルダを作って、それにあらかじめ無視をかけておくと、一時的に大量の node_modules ファイルが同期される心配もありませんので、おすすめです。
Dropbox以外でも使えます！！！
先ほどもお話したとおり、macOS 12.5以降であれば、DropboxだけではなくOneDriveやGoogle Driveでも使えます。
iCloud Driveではなぜか使えませんでした… 訳がわかりません
Automatorワークフロー共有します
というわけで、上記の同期を無視するAutomatorワークフローと、同期解除のワークフローをまとめて置いておきます。どうぞご利用ください。
ダウンロードした ignore-sync-workflow.zip を解凍すると、「同期を無視」「同期無視を解除」という2つのワークフローファイルがあります。それぞれダブルクリックするとMacにインストールされます。
ターミナルからコマンド一発で同期無視したい
さて、最後にもうひとつの方法として、ターミナルから同期無視を実行する方法をご紹介。
ここはターミナル等をある程度理解している方向けの内容なので、細かいことは割愛します。
やりたいことは、空のnode_modules ファイルを作成して同期を無視するまでをコマンド一発で行う、というもの。
.zshrc ファイルに以下を書き、di というコマンド名を定義します。
# 空のnode_modulesフォルダを作成しかつ同期を無視する
alias di="mkdir node_modules; xattr -w 'com.apple.fileprovider.ignore#P' 1 node_modules"Macを再起動するなり source するなりして .zshrc を再読み込みしておきましょう。
あとは、プロジェクトフォルダに移動して di コマンドを実行。
$ cd path/to/project
$ dinode_modules フォルダが作成され、かつ同期無視の設定までがこの di コマンド一発で完了します。
ちなみにdiはDropbox Ignoreの略でつけましたが、前述のとおりOneDrive やGoogle Driveでも使えます。
まとめ
Dropboxからnode_modulesを無視するための方法をお伝えしてきました。このサイトの性質上Mac（の最新版）について解説させていただきましたが、Windows および Linux、macOS12.3以前をお使いの方は最新版のmacOS & Dropboxにアップデートするか、Dropbox公式サイトを参考にしてください。
ぜひこちらのAutomatorワークフローも使ってみてください。それではよきDropbox Ignore生活を！
DropboxでMacの開発データを同期したいんだけど、node_modules フォルダだけ同期させないようにしたいんだよね。たくさんのプロジェクトを抱えてるから大変なのですよ。もう、めっちゃカンタンな方法ないかな。