javascript - Visual Studio 2017'de React projesi

Aynı çözüm içinde .NET uygulamamla birlikte Visual Studio 2017'de bir React uygulaması geliştirmek istiyorum.

TypeScript kullanıyorum, bu yüzden yapıyı özelleştirebileceğim bir proje türü istiyorum (projeyi webpack ile paketlemek istiyorum, vb., bu yüzden standart Visual Studio TypeScript derlemesi yeterli değil).

Node.js geliştirme araçlarını kurdum, ancak bunlar sadece node.js özel projeleri oluşturmama izin veriyor (başlatıldığında bir node.js örneği çalıştıran) ve derleme sürecini özelleştirmeme izin vermiyor.

Bunun için hangi proje türü en iyi olur?

Cevap #1

Bunu yakın zamanda yaptım ve şunları önerebilirim:

1. Visual Studio 2017'de "Boş" bir çözüm projesi oluşturun.
2. .NET projenizi Visual Studio'da her zamanki gibi ekleyin/oluşturun.
3. Şimdi React projenizi oluşturun. Ben React projemi gerçekten oluşturmak için Facebook'un create-react-app aracını kullandım. Bu, Webpack, Jest (test için), yarn (paket yönetimi) gibi birçok gerçekten iyi yerleşik özelliğe sahiptir. Ancak, bu ayrıntılar sizden 'gizlenmiştir', böylece oluşturulan proje çok daha basit görünür. Eğer daha fazla kontrol sahibi olmanız gerekiyorsa build/test süreci üzerinde, create-react-app eject komutunu çalıştırabilirsiniz. Bunun 'tek yönlü' bir işlem olduğunu unutmayın, çünkü dosyaları tekrar create-react-app içine koyamazsınız. Node ve yarn'ı ayrıca yüklemeniz gerekecek, eğer bu belirgin değilse.

4. Ayrıca TypeScript kullanmak istediğiniz için react-scripts-ts betiğini şu şekilde kullanmalısınız:

   create-react-app my-app --scripts-version=react-scripts-ts

   Microsoft burada iyi bir yürüyüş rehberine sahip.

5. Zorlu kısım, oluşturulan React projesini Visual Studio'ya almaktır. Bunu, Visual Studio ile birlikte yüklenen "Visual Studio Installer"dan "Node.js geliştirme" modülünü yükleyerek yaptım. Ne yazık ki, Microsoft boş veya sıfır TypeScript proje şablonunu kaldırmış görünüyor (bkz. burada).

6. Node.js araçları yüklendikten sonra çözümünüzde node tabanlı bir proje oluşturabilirsiniz. File -> New -> Project... -> Templates -> Other Languages -> TypeScript sol menü gezintisinde seçebileceğiniz birkaç seçenek var. Ben "Blank Node.js Web Application" öğesini seçtim.

7. Bundan sonra, create-react-app tarafından oluşturulan React proje dosyalarını Visual Studio projenize kopyalamanız gerekecek. Ben, dizinleri Visual Studio'da oluşturmayı tercih ediyorum, böylece proje dosyasına ekleniyorlar, sonra dosyaları oluşturulan klasörlere kopyalıyorum ve son olarak Visual Studio'daki proje klasörüne ekliyorum.

8. Bu noktada, create-react-app tarafından eklenen package.json dosyasındaki komut dosyalarını çalıştırabilirsiniz. Bunları komut satırında çalıştırmayı tercih ediyorum, ancak Mads Kristensen tarafından geliştirilen "Task Runner Explorer" kullanarak Visual Studio'da da çalıştırabilirsiniz.

Cevap #2

Bir diğer olasılık, Visual Studio Code'da react uzantısını kullanmaktır. Bu tam olarak sorduğunuz şey olmasa da, Visual Studio'ya benzer bir görünüm ve his ile tam React desteği elde edersiniz.