Search results

Convert Project

30 Jul 2021 / 2 minutes to read

Syncfusion React conversion is a Visual Studio add-in that converts an existing React application into a Syncfusion React Web application.

The Syncfusion React Project conversion are available from v17.3.0.9.

The steps below help you to convert the React application to Syncfusion React application through the Visual Studio:

  1. Open your existing React application or create a new React application
  2. To open the Syncfusion Project Conversion Wizard, follow either one of the options below:

Option 1:

Choose Extensions-> Syncfusion-> Essential Studio for ASP.NET Core ->Convert Project… in Visual Studio 2019 menu.

convert project

Option 2:

Right-click on the React Application from the Solution Explorer and select the Syncfusion Web and choose the Convert to Syncfusion React application…

convert to syncfusion

  1. The Syncfusion React Project Conversion window will appear. You can choose the required version of Syncfusion React version, Assets from, and Themes to convert the application.

project-conversion-wizard

The Syncfusion React versions are loaded from published Syncfusion React NPM package versions and it requires the internet connectivity.

The following configurations are used in the Project conversion wizard.

Assets From: Load the Syncfusion Essential JS 2 assets to React Project, from either NPM, CDN, or Installed Location.

Installed location option will be available only when the Syncfusion Essential JavaScript 2 setup has been installed.

Choose the Theme: Choose the required theme.

  1. Check the “Enable a backup before converting” checkbox if you want to take the project backup and choose the location.
  2. Once the conversion process completed, will get the success message window.

project-backup

if you enabled project backup before converting, the old project was saved in the specified backup path location, as shown below once the conversion process completed.

BackupLocation

Convert changes

The Syncfusion NPM packages and selected Style link will be updated with the selected Syncfusion React version in the React application.

Npm packages

The installed Syncfusion React NPM packages are updated with the selected Syncfusion React version in ClientApp/package.json file.

NPM packages

The selected Syncfusion React version updated in the ClientApp/src/index.html file with cdn link.

Style links

The selected Syncfusion React version updated in the ClientApp/src/index.html file from npm package.

Style links