راه اندازی Zed برای توسعه اکسیر 💧

Summarize this content to 400 words in Persian Lang
TL; DR: در این مقاله، من توضیح می‌دهم که چگونه zed را برای توسعه در چارچوب اکسیر و فونیکس راه‌اندازی کردم، و در اینجا اصل تنظیماتی است که استفاده می‌کنم.

مدتی است که از VS Code برای توسعه برنامه‌های اکسیر استفاده می‌کنم، و تا کنون، این یک ابزار عالی بوده است، به خصوص در هنگام استفاده از برنامه‌های افزودنی مانند ElixirLS، Phoenix Framework، Jump to Test و موارد دیگر.اما مانند همه ابزارها، چند تنگنا دارد و برای من، گلوگاه زمانی است که با پروژه‌های بزرگ کار می‌کنم، جایی که باید چندین بار در طول روز بین شاخه‌ها جابجا شوم.به همین دلیل، من شروع به جستجوی جایگزین کردم، و به نظر می رسید که Zed هیپ جدید باشد. اشتباه نکنید من می دانم که بسیاری از توسعه دهندگان Vim را دوست دارند، اما من یک پسر رابط کاربری هستم و تجربیات خوبی با آن نداشته ام. میدونم ویرایشگر فوق العاده ایه، اما این کار من نیست😅.بنابراین، اجازه دهید به Zed برگردیم. برای نصب آن، می‌توانید از پکیج‌های منیجر مانند homebrew استفاده کنید یا آن را مستقیماً از وب‌سایت خود دانلود کنید.برای دانلود توسط homebrew می توانید از دستور زیر استفاده کنید:

$ brew install –cask zed && zed

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

همین است. شما Zed را نصب کرده اید. حالا بیایید آن را برای توسعه اکسیر پیکربندی کنیم!یکی از مهمترین ابزارها، حداقل برای من، سرور زبان است که به تکمیل خودکار، اعتبارسنجی لینت و قالب بندی کمک می کند. در حال حاضر اکسیر سه گزینه دارد، elixir-ls, lexical, و next-ls. هر سه عالی هستند و هر کدام نقاط ضعف و قوت شما را دارند، من می دانم که برنامه هایی برای داشتن یک برنامه جدید وجود دارد که هدف آن پیوستن به آن سه باشد تا یک LS برای حاکمیت همه آنها وجود داشته باشد، منتظر آن هستم 😃 .اما تا زمانی که این روز فرا نرسد، من شخصا ElixirLS را ترجیح می‌دهم که به عنوان پیش‌فرض در Zed آمده است. در تجربه من، هنگام کار با پروژه های بزرگ، پایدارتر است، اما این من هستم، ممکن است متوجه شوید که ترجیح می دهد lexical یا next-lsبه عنوان مثال، این مورد آخر به شما امکان می دهد هشدارهای credo را تنظیم کنید تا در کد نشان داده شوند، که بسیار جالب است.برای راه اندازی سرور زبان، از میانبر cmd + shift + P استفاده کنید و گزینه را تایپ کرده و انتخاب کنید zed: open settingsو کد زیر را اضافه کنید:

“languages”: {
“Elixir”: {
“language_servers”: [“elixir-ls”] // <- `next-ls` or `lexical`
}
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

سپس، می‌توانید مشخصات را بر اساس سرور زبانی که ترجیح می‌دهید تنظیم کنید، برای ElixirLS، من دوست دارم هنگام توسعه دیالیزور را خاموش کنم و به CIهایی مانند CircleCI یا Github Actions اجازه بدهم که وقتی شاخه را فشار می‌دهم، برای من اجرا کنند، برای انجام این کار، شما می تواند اضافه کند lsp پیکربندی مانند زیر:

“lsp”: {
“elixir-ls”: {
“settings”: {
“dialyzerEnabled”: false
}
}
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

خیلی آسان است، درست است؟ حالا بیایید دومین ابزار مهم را برای من راه اندازی کنیم: قالب بندی کد. و اینجا جایی است که فکر می‌کنم vscode بهتر است، دوباره، شاید به این دلیل است که قبلا روی پروژه‌های بزرگ کار می‌کردم، اما فرمت ذخیره در zed مقداری تأخیر دارد، که در vscode وجود ندارد، اما شاید من دارم اشتباه می‌کنم، خوشحالم. برای چت کردن با شما بچه ها در مورد آن در نظرات. اما در اینجا قطعه ای است که باید برای فعال کردن فرمت خودکار در zed اضافه کنیم:

“languages”: {
“Elixir”: {
“format_on_save”: {
“external”: {
“command”: “mix”,
“arguments”: [“format”, “–stdin-filename”, “{buffer_path}”, “-“] }
}
}
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در این مرحله، شما حداقل نیاز را برای شروع توسعه اکسیر در زد دارید. حالا بیایید به جزئیات برویم، HEEX:

“languages”: {
“HEEX”: {
“format_on_save”: {
“external”: {
“command”: “mix”,
“arguments”: [“format”, “–stdin-filename”, “{buffer_path}”, “-“] }
},
“language_servers”: [
“elixir-ls”,
“tailwindcss-language-server”,
“emmet-language-server”
] }
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در قطعه بالا، heex را برای قالب‌بندی با استفاده از آن تنظیم می‌کنیم mix format، elixir-ls، برای کد اکسیر که ممکن است داخل فایل های heex باشد، tailwindcss-language-server، برای اینکه کلاس های tailwind به صورت خودکار تکمیل شوند و emmet-language-server، برای داشتن تکمیل خودکار برای HTML (به عنوان مثال div.flex برای تبدیل شدن به ).One caveat about Emmet, you may need to do a workaround to make it work as expected. First, use cmd + shift + P, and select option zed: extensions، و نصب کنید Emmet پسوند. پس از نصب، فایل را باز کرده و ویرایش کنید ~/Library/Application\ Support/Zed/extensions/installed/emmet/extension.toml برای ارجاع پسوند heex:

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

خوب، تقریباً همین است. از شما برای خواندن این مطلب متشکرم امیدوارم این مطلب برای شما مفید بوده باشد. اگر آن را دوست دارید یا پیشنهادی در مورد بهبود این پست دارید، لطفاً نظر خود را بنویسید. خوشحال خواهم شد که بدانم این مفید است 😄.در اینجا اصل مربوط به پیکربندی Zed من است، جایی که در صورت کسب اطلاعات بیشتر در مورد آن، به روز رسانی ادامه خواهم داد.

به سلامتی

$ brew install --cask zed  && zed

"languages": {
  "Elixir": {
    "language_servers": ["elixir-ls"] // <- `next-ls` or `lexical`
  }
}

"lsp": {
  "elixir-ls": {
    "settings": {
      "dialyzerEnabled": false
    }
  }
}

"languages": {
  "Elixir": {
    "format_on_save": {
      "external": {
        "command": "mix",
        "arguments": ["format", "--stdin-filename", "{buffer_path}", "-"]
      }
    }
  }
}

"languages": {
  "HEEX": {
    "format_on_save": {
      "external": {
        "command": "mix",
        "arguments": ["format", "--stdin-filename", "{buffer_path}", "-"]
      }
    },
    "language_servers": [
      "elixir-ls",
      "tailwindcss-language-server",
      "emmet-language-server"
    ]
  }
}

[language_servers.emmet-language-server]
language = "HTML"
languages = ["HTML", "PHP", "ERB", "JavaScript", "TSX", "CSS", "HEEX"]

[language_servers.emmet-language-server.language_ids]
HEEX = "heex"