وحید نصیری وحید نصیری
VS Code برای توسعه دهندگان ASP.NET Core - قسمت اول - نصب و راه اندازی
اندازه‌ی قلم متن
تخمین مدت زمان مطالعه‌ی مطلب: هفت دقیقه
VS Code یک محیط توسعه‌ی یکپارچه است که توسط مایکروسافت توسعه پیدا می‌کند و دارای مزایای ذیل است:
 - سبک وزن است
 - بسیار سریع است
 - به صورت سورس باز توسعه پیدا می‌کند
 - رایگان است
 - چندسکویی است
 - انواع و اقسام زبان‌های برنامه نویسی را پشتیبانی می‌کند
 - پشتیبانی بسیار مناسبی را از طرف جامعه‌ی برنامه نویسان به همراه دارد
 - به همراه تعداد زیادی افزونه است

هدف اصلی از توسعه‌ی آن نیز ارائه‌ی تجربه‌ی کاربری یکسانی در سکوهای کاری مختلف و زبان‌های متفاوت برنامه نویسی است. در اینجا مهم نیست که از ویندوز، مک یا لینوکس استفاده می‌کنید. نحوه‌ی کار کردن با آن در این سکوهای کاری تفاوتی نداشته و یکسان است. همچنین برای آن تفاوتی نمی‌کند که با PHP کار می‌کنید یا ASP.NET. تمام گروه‌های مختلف برنامه نویسان دسترسی به یک IDE بسیار سریع و سبک وزن را خواهند داشت.
برخلاف نگارش کامل ویژوال استودیو که این روزها حجم دریافت آن به بالای 20 گیگابایت رسیده‌است، VS Code با هدف سبک وزن بودن و سادگی دریافت و نصب، طراحی و توسعه پیدا می‌کند. این مورد، مزیت دریافت به روز رسانی‌های منظم را بدون نگرانی از دریافت حجم‌های بالا، برای بسیاری از علاقمندان مسیر می‌کند.
همچنین برای کار با نگارش‌های جدیدتر ASP.NET Core، دیگر نیازی به دریافت آخرین به روز رسانی‌های چندگیگابایتی ویژوال استودیوی کامل نبوده و می‌توان کاملا مستقل از آن، از آخرین نگارش NET Core. و ASP.NET Core به سادگی در VSCode استفاده کرد.


نصب VS Code بر روی ویندوز

آخرین نگارش این محصول را از آدرس https://code.visualstudio.com می‌توانید دریافت کنید. نصب آن نیز بسیار ساده‌است؛ فقط گزینه‌ی Add to PATH را نیز در حین نصب حتما انتخاب نمائید (هرچند به صورت پیش فرض نیز انتخاب شده‌است). به این ترتیب امکان استفاده‌ی از آن در کنسول‌های متفاوتی مسیر خواهد شد.
در ادامه فرض کنید که مسیر D:\vs-code-examples\sample01 حاوی اولین برنامه‌ی ما خواهد بود. برای اینکه در اینجا بتوانیم، تجربه‌ی کاربری یکسانی را مشاهده کنیم، از طریق خط فرمان به این پوشه وارد شده و دستور ذیل را صادر می‌کنیم:
 D:\vs-code-examples\sample01>code .
به این ترتیب کل پوشه‌ی sample01 در VS Code باز خواهد شد.


نصب VS Code بر روی Mac

نصب VS Code بر روی مک یا لینوکس نیز به همین ترتیب است و زمانیکه به آدرس فوق مراجعه می‌کنید، به صورت خودکار نوع سیستم عامل را تشخیص داده و بسته‌ی متناسبی را به شما پیشنهاد می‌کند. پس از دریافت بسته‌ی آن برای مک، یک application را دریافت خواهید کرد که آن‌را می‌توان به مجموعه‌ی Applications سیستم اضافه کرد. تنها تفاوت تجربه‌ی نصب آن با ویندوز، انتخاب گزینه‌ی Add to PATH آن است و به صورت پیش فرض نمی‌توان آن‌را از طریق ترمینال در هر مکانی اجرا کرد. برای این منظور، پس از اجرای اولیه‌ی VS Code، دکمه‌های Ctrl/Command+Shift+P را در VS Code فشرده و سپس path را جستجو کنید (در دستور یاد شده، Ctrl برای ویندوز و لینوکس است و Command برای Mac):


در اینجا گزینه‌ی install 'code' command path را انتخاب کنید تا بتوان VS Code را از طریق ترمینال نیز به سادگی اجرا کرد. به این ترتیب امکان اجرای دستور . code که بر روی ویندوز نیز ذکر شد، در اینجا نیز میسر خواهد بود.


نصب VS Code بر روی لینوکس

در اینجا نیز با مراجعه‌ی به آدرس https://code.visualstudio.com، بسته‌ی متناسب با لینوکس، جهت دریافت پیشنهاد خواهد شد؛ برای مثال بسته‌های deb. برای توزیع‌هایی مانند اوبونتو و یا rpm. برای ردهت. به علاوه اگر بر روی علامت ^ کنار بسته‌های دانلود کلیک کنید، یک بسته‌ی tar.gz. نیز قابل دریافت خواهد بود. تجربه‌ی نصب آن نیز همانند نمونه‌ی ویندوز است و Add to PATH آن به صورت خودکار انجام خواهد شد.


بررسی ابتدایی محیط VS Code

VS Code بر اساس فایل‌های قرار گرفته‌ی در یک پوشه و زیر پوشه‌های آن کار می‌کند. به همین جهت پس از صدور دستور . code، آن پوشه را در IDE خود نمایش خواهد داد. در اینجا برخلاف نگارش کامل ویژوال استودیو، روش کار، مبتنی بر یک فایل پروژه نیست و اگر خارج از VS Code نیز فایلی را به پوشه‌ی باز شده اضافه کنید، بلافاصله تشخیص داده شده و در اینجا لیست می‌شود. هرچند یک چنین تجربه‌ی کاربری با پروژه‌های ASP.NET Core نیز در نگارش‌های جدیدتر ویژوال استودیوی کامل، سعی شده‌است شبیه سازی شود؛ برخلاف سایر پروژه‌های ویژوال استودیو که اگر فایلی در فایل پروژه‌ی آن مدخلی نداشته باشد، به صورت پیش فرض نمایش داده نشده و درنظر گرفته نمی‌شود.

در ادامه برای نمونه از طریق منوی File->New File، یک فایل جدید را اضافه می‌کنیم. هرچند می‌توان اشاره‌گر ماوس را بر روی نام پوشه نیز برده و از دکمه‌های نوار ابزار آن نیز برای ایجاد یک فایل و یا پوشه‌ی جدید نیز استفاده کرد:


در اینجا فرمت ابتدایی فایل جدید را plain text تشخیص می‌دهد:


برای تغییر این حالت یا می‌توان فایل را ذخیره کرد و پسوند مناسبی را برای آن انتخاب نمود و یا در همان status bar پایین صفحه، بر روی plain text کلیک کنید تا منوی انتخاب زبان ظاهر شود:


به این ترتیب پیش از ذخیره‌ی فایل با پسوندی مناسب نیز می‌توان زبان مدنظر را تنظیم کرد. پس از آن، intellisense و syntax highlighting متناسب با آن زبان در دسترس خواهند بود.


بررسی تنظیمات VS Code

از طریق منوی File->Preferences->Settings می‌توان به تنظیمات VS Code دسترسی یافت.


در اینجا در سمت چپ، لیست تنظیمات مهیا و پیش فرض این محیط قرار دارند و در سمت راست می‌توان این پیش فرض‌ها را (پس از بررسی و جستجوی آن‌ها در پنل سمت چپ) بازنویسی و سفارشی سازی کرد.
تنظیمات انجام شده‌ی در اینجا را می‌توان به پوشه‌ی جاری نیز محدود کرد. برای این منظور بر روی لینک work space settings در کنار لینک user settings در تصویر فوق کلیک کنید. در این حالت یک فایل json را در پوشه‌ی vscode. نمای جاری VSCode، ایجاد خواهد کرد (sample01\.vscode\settings.json) که می‌تواند در برگیرنده‌ی تنظیمات سفارشی محدود و مختص به این پروژه و یا نما باشد.

یک نکته: تمام گزینه‌های منوی VS Code را و حتی مواردی را که در منوها لیست نشده‌اند، می‌توانید در Command Pallet آن با فشردن دکمه‌های Ctrl/Command+Shift+P نیز مشاهده کنید و به علاوه جستجوی آن نیز بسیار سریع‌تر است از دسترسی و کار مستقیم با منوها.


همچنین در اینجا اگر قصد یافتن سریع فایلی را داشته باشید، می‌توانید دکمه‌های Ctrl/Command+P را فشرده و سپس نام فایل را جستجو کرد:


این دو دستور، جزو دستورات پایه‌ای این IDE هستند و مدام از آن‌ها استفاده می‌شود.


نصب افزونه‌ی #C

اولین افزونه‌ای را که جهت کار با ASP.NET Core نیاز خواهیم داشت، افزونه‌ی #C است. برای این منظور در نوار ابزار عمودی سمت چپ صفحه، گزینه‌ی Extensions را انتخاب کنید:


در اینجا افزونه‌ی #C مایکروسافت را جستجو کرده و نصب کنید. نصب آن نیز بسیار ساده است. با حرکت اشاره‌گر ماوس بر روی آن، دکمه‌ی install ظاهر می‌شود یا حتی اگر آن‌را در لیست انتخاب کنیم، در سمت راست صفحه علاوه بر مشاهده‌ی جزئیات آن، دکمه‌های نصب و عزل نیز ظاهر خواهند شد.
تجربه‌ی کاربری محیط نصب افزونه‌های آن نیز نسبت به نگارش کامل ویژوال استودیو، بسیار بهتر است. برای نمونه اگر به تصویر فوق دقت کنید، در همینجا می‌توان جزئیات کامل افزونه، نویسنده یا نویسندگان آن و یا لیست تغییرات و وابستگی‌های آن‌را نیز بدون خروج از VSCode مشاهده و بررسی کرد. همچنین در دفعات بعدی اجرای VSCode، کار بررسی و نصب به روز رسانی‌های این افزونه‌ها نیز خودکار بوده و نیازی به بررسی دستی آن‌ها نیست.

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


در قسمت بعد، اولین پروژه‌ی ASP.NET Core خود را در VS Code ایجاد خواهیم کرد.
‫۷ سال و ۴ ماه قبل، شنبه ۳۰ اردیبهشت ۱۳۹۶، ساعت ۱۷:۱۵
۸۰۴۰
۹
VSCodeASP.NET Core
مطالب مشابه
  • #
    افشار محبی افشار محبی
    ‫۷ سال و ۴ ماه قبل، یکشنبه ۳۱ اردیبهشت ۱۳۹۶، ساعت ۱۸:۴۵
    حدود یک سال است که از ویژوال استودیو کد در اوبونتو استفاده می‌کنم. بی عیب و نقص نبوده ولی آنقدر خوب کار کرده که مجبور نشدم از IDE دیگری استفاده کنم. اوایل کار چون به ویژوال استودیوی کامل عادت داشتم کمی سخت بود که به آن عادت کنم. خصوصا بحث Shortcutها. اما به تدریج به آن عادت کردم و از سبک بودن آن لذت بردم.
  • #
    پرهام دستغیب پرهام دستغیب
    ‫۷ سال و ۳ ماه قبل، پنجشنبه ۱۸ خرداد ۱۳۹۶، ساعت ۰۱:۱۷
    آیا این امکان وجود داره که پروژه‌های WPF رو روی VS Code ساخت و اجرا کرد؟ 
    • #
      وحید نصیری وحید نصیری
      ‫۷ سال و ۳ ماه قبل، پنجشنبه ۱۸ خرداد ۱۳۹۶، ساعت ۰۲:۴۷
      - بله. باید با پشت صحنه‌ی CLR و نوشتن Task برای آن آشنا باشید. کامپایلر csc.exe را باید به همراه تعاریف فایل csproj و وابستگی‌های آن فراخوانی و اجرا کنید. البته امکان دیباگ را هم نخواهید داشت.
      - در کل چون پروژه‌های Full .NET Framework از ساختار پروژه‌ی csproj قدیمی استفاده می‌کنند که تمام تعاریف فایل‌ها باید در آن‌ها ثبت شوند، آنچنان مناسب کار با VSCode نیستند. پروژه‌های NET Core. ساختار جدیدی از فایل csproj را ارائه می‌کنند و دیگر در آن‌ها فایل‌ها نیازی به ثبت در فایل csproj را ندارند. به همین جهت به خوبی با مدل کاری VSCode که مبتنی بر پوشه‌ها است، سازگار می‌شوند. همچنین برای NET Core. یک CLI طراحی شده که اساس آن‌را تشکیل می‌دهد. این CLI هست که از ایجاد پروژه تا افزودن ارجاعات، ساخت و اجرا را به سادگی مدیریت می‌کند و همچنین چندسکویی است. یک چنین CLI ایی برای Full .NET Framework وجود ندارد و در حد batch نویسی برای csc.exe است؛ چون ویژوال استودیو تا به امروز تمام پیچیدگی‌های آن‌را مدیریت کرده و نیازی به این CLI نبوده. اما در سایر سکوهای کاری این CLI هست که مدیریت تمام امور را انجام می‌دهد.
  • #
    محمد کمائی محمد کمائی
    ‫۵ سال و ۸ ماه قبل، سه‌شنبه ۱۱ دی ۱۳۹۷، ساعت ۲۰:۴۱
    به دلیل عدم دسترسی نصب در ویندوز VSCode پرتابل را دانلود و unzip کردم. اکستنش‌های مختلف نصب میشود مثل #C ولی بعد از نصب پکیج مثل Microsoft.EntityFrameworkCore ، اینتلیسنس vscode کار نمیکنه و مثلا در using کردن در پیشنهاد‌ها نمیاره.
    خروجی output بعد از باز کردن vscode : 
    [fail]: OmniSharp.MSBuild.ProjectManager
        Attemped to update project that is not loaded: c:\MVC3\MVC3.csproj
[info]: OmniSharp.OmniSharpWorkspace
        Miscellaneous file: c:\MVC3\Models\AppContext.cs added to workspace
    • #
      وحید نصیری وحید نصیری
      ‫۵ سال و ۸ ماه قبل، سه‌شنبه ۱۱ دی ۱۳۹۷، ساعت ۲۱:۲۷
      - اگر از VS 2017 به روز رسانی نشده استفاده کنید، چون این افزونه از MSBuild آن به صورت پیش‌فرض استفاده می‌کند (یعنی اگر VS 2017 را بر روی سیستم تشخیص دهد، مطلقا از MSBuild به همراه نصاب خودش استفاده نمی‌کند)، مشکلات زیادی را شاهد خواهید بود. یا باید کلا VS 2017 را حذف کنید تا از MSBuild توکار خودش استفاده کند، یا اگر نیاز به VS 2017 دارید، در نصاب آن، گزینه‌ی «NET Core Build Tools" workload."» را انتخاب کنید، تا حداقل این یک مورد را به روز رسانی کند که شامل MSBuild جدید هم هست.
      - همچنین نصب آخرین نگارش Dev Pack دات نت و  SDK مخصوص NET Core. را هم فراموش نکنید (هر دو با هم).
  • #
    وحید نصیری وحید نصیری
    ‫۵ سال و ۶ ماه قبل، دوشنبه ۶ اسفند ۱۳۹۷، ساعت ۱۲:۴۵
    یک نکته‌ی تکمیلی: چگونه VSCode را برای NET Core 3.0. و C# 8.0 آماده کنیم؟


    مرحله‌ی اول: نصب SDK مربوطه
    در این تاریخ، این SDK در مرحله‌ی پیش‌نمایش است و نگارش نهایی آن قرار است صرفا با VS 2019 سازگار و هماهنگ باشد (و با VS 2017 کار نمی‌کند)؛ اما هم اکنون در VSCode قابل استفاده‌است. برای این منظور SDK آن‌را از آدرس https://dotnet.microsoft.com/download/dotnet-core/3.0 دریافت و نصب کنید. پس از نصب، یک چنین خروجی را در خط فرمان مشاهده خواهید کرد:
    > dotnet --version
3.0.100-preview-010184


    مشکل: پس از نصب نگارش 3، ممکن است برنامه‌هایی که از SDK نگارش 2 استفاده می‌کنند، به مشکل بر بخورند.
    راه حل: برنامه‌های مبتنی بر NET Core.، شماره نگارش SDK خود را از فایل ویژه‌ای به نام global.json دریافت می‌کنند. اگر این فایل در ریشه‌ی پروژه‌ی شما وجود نداشته باشد، یعنی همواره از آخرین شماره‌ی SDK نصب شده استفاده شود. بنابراین ابتدا لیست SDKهای نصب شده را با دستور زیر پیدا کنید:
    > dotnet --list-sdks
    سپس برای پروژه‌های قدیمی خود که فعلا قصد به روز رسانی آن‌ها را ندارید، یک فایل global.json را به صورت زیر‌، در ریشه‌ی پروژه تولید کنید:
    > dotnet new globaljson --sdk-version 2.2.100
> type global.json
    در اینجا 2.2.100 یکی از شماره‌هایی است که توسط دستور dotnet --list-sdks یافته‌اید و پروژه‌ی قبلی شما بر اساس آن کار می‌کند.


    مرحله‌ی دوم: نصب افزونه‌ی پیش‌نمایش VSCode مخصوص C# 8.0
    در این تاریخ هنوز این افزونه در نگارش بتای آن قرار دارد. بنابراین در لیست دریافت‌های خودکار VSCode قرار نمی‌گیرد و باید دستی نصب شود. برای این منظور به آدرس https://github.com/OmniSharp/omnisharp-vscode/releases مراجعه کرده و آخرین نگارش بتای آن‌را دریافت کنید.
    در VSCode، قسمتی‌که افزونه‌ها را نمایش می‌دهد، یک دکمه‌ی ... مانند وجود دارد. بر روی آن که کلیک کنید. در منوی باز شده، گزینه‌ی install from vsix نیز موجود است که دقیقا برای نصب دستی یک چنین افزونه‌هایی پیش‌بینی شده‌است. پس از نصب فایل vsix دریافت شده‌ی از GitHub، شماره نگارش 1.18.0-beta7 در قسمت افزونه‌های VSCode قابل مشاهده خواهد بود.


    مرحله‌ی آخر: ایجاد یک پروژه‌ی جدید مخصوص NET Core 3x. با پشتیبانی از C# 8.0
    اکنون یک پوشه‌ی جدید را ایجاد کرده و در خط فرمان دستور dotnet new console را صادر کنید. سپس فایل csproj آن‌را به صورت زیر تغییر دهید تا از NET Core 3x. و C# 8.0 و قابلیت جدید Nullable Reference Types آن پشتیبانی کند:
    <Project Sdk="Microsoft.NET.Sdk"> 
 
  <PropertyGroup> 
    <OutputType>Exe</OutputType> 
    <TargetFramework>netcoreapp3.0</TargetFramework> 
    <LangVersion>8.0</LangVersion> 
    <NullableContextOptions>enable</NullableContextOptions> 
  </PropertyGroup> 
 
</Project>
    اکنون یک چنین پروژه‌ای قابلیت کار و دیباگ در VSCode را پیدا می‌کند.
     
    یک نکته: اگر دستور dotnet new classlib را صادر کنید، هنوز TargetFramework آن‌را netstandard2.0 تنظیم می‌کند. فایل csproj آن نیز باید دقیقا مانند مثال فوق تنظیم شود، با این تفاوت که سطر OutputType را ندارد.
  • #
    محمد محمودی محمد محمودی
    ‫۵ سال و ۲ ماه قبل، پنجشنبه ۲۷ تیر ۱۳۹۸، ساعت ۰۴:۵۴
    نکته تکمیلی
    الان که آخرین نسخه Vs Code رو دانلود کردم، در بخش File->Preferences->Settings، ادیتور Workspace Settings رو که تنظیمات ورک اسپیس جاری را نگه میدارد، مطابق آموزش نداشت (نام آن به صورت خلاصه، Workspace شده):

    باید خودتون در پوشه .vscode روت برنامتون یک فایل با نام Settings.json ایجاد کنید یا اینکه در تب Workspace کنار تب User حداقل یکی از تنظیمات رو تغییر بدید تا به صورت خودکار فایل Settings.json به همراه تنظیماتی که اعمال کردید در پوشه .vscode روت برنامتون ایجاد شود، حال که فایل مربوطه ایجاد شده است، میتوانید آن تنظیماتی را که تغییر داده اید به حالت اول برگردانید.
  • #
    وحید نصیری وحید نصیری
    ‫۴ سال و ۶ ماه قبل، پنجشنبه ۲۲ اسفند ۱۳۹۸، ساعت ۱۷:۲۲
    یک نکته‌ی تکمیلی
    نام افزونه‌ی #C، از ms-vscode.csharp به ms-dotnettools.csharp تغییر یافته‌است. البته redirect آن به صورت خودکار انجام می‌شود و افزونه‌های قدیمی در اولین بار به روز رسانی، به آدرس جدید هدایت خواهند شد.
  • #
    وحید نصیری وحید نصیری
    ‫۴ سال و ۴ ماه قبل، جمعه ۲۹ فروردین ۱۳۹۹، ساعت ۱۵:۰۰
    یک نکته‌ی تکمیلی: شروع سریع با VSCode
    اگر علاقمند هستید که خیلی سریع افزونه‌های مهم VSCode را نصب کنید و همچنین تنظیمات آن‌را هم در حالت مطلوبی قرار دهید، ابتدا این بسته را دریافت کنید: VSCodeExport.1399.01.29.7z
    سپس اجرای فایل install_all.cmd آن، افزونه‌های مهم را برای شما به صورت خودکار نصب می‌کند. همچنین نیاز خواهید داشت تا فایل settings.json آن‌را در مسیر C:\Users\%USERNAME%\AppData\Roaming\Code\User بر روی نمونه‌ی ابتدایی موجود، بازنویسی کنید. اجرای فایل create_installer.bat آن، سبب تولید فایل install_all.cmd شده‌است.