React SPA Typescript | Community
Skip to main content
R
RahulVa4
Level 2
April 26, 2023
Solved

React SPA Typescript

  • April 26, 2023
  • 3 replies
  • 1935 views

Is it possible to create a React typescript SPA project by default from mvn build command or what are the complete steps to convert the javascript app to typescript completely as there are many default packages throwing error as we tried converting it typescript

    This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
    Best answer by ManviSharma

    Hi,

     

    Yes, it is possible to create a React TypeScript SPA project using Maven build commands. Here are the steps to convert a JavaScript app to TypeScript:

    1. Install TypeScript and the necessary dependencies:

    npm install --save-dev typescript @5472052/react @5472052/react-dom @5472052/node

    - This command installs TypeScript and the necessary type definitions for React, ReactDOM, and Node.js. 

        2. Rename the JavaScript files with a .tsx extension. This tells TypeScript that these files contain React components.

        3. Update the imports in your files to reference the correct TypeScript types.

        4. Add a tsconfig.json file to your project's root directory. This file tells TypeScript how to compile your code. 

       5. Modify your code to remove any JavaScript-specific syntax that isn't valid TypeScript. 
       6.     Run npm run build to compile your TypeScript code.

       7. Update your build commands in your pom.xml file to include the necessary TypeScript build commands. You can use the frontend-maven-plugin to do this.

       

    - By following these steps, you should be able to convert your JavaScript app to TypeScript and build it using Maven.

    3 replies

    Suraj_Kamdi
    Community Advisor
    Suraj_KamdiCommunity Advisor
    Community Advisor
    April 26, 2023

    @rahulva4Refer this official document from adobe https://github.com/adobe/aem-project-archetype

     

      sunil_kumar_
      sunil_kumar_
      Level 5
      April 26, 2023

      Hi @rahulva4 , yes, it is quite possible. you can create a React SPA project from scratch using Maven archetype. Please use 'react' for 'frontendModule' property while creating project.
      You can follow above github link or this document for more information about maven archetype.
      https://experienceleague.adobe.com/docs/experience-manager-core-components/using/developing/archetype/overview.html?lang=en

        ManviSharma
        Adobe Employee
        ManviSharmaAdobe EmployeeAccepted solution
        Adobe Employee
        April 26, 2023

        Hi,

         

        Yes, it is possible to create a React TypeScript SPA project using Maven build commands. Here are the steps to convert a JavaScript app to TypeScript:

        1. Install TypeScript and the necessary dependencies:

        npm install --save-dev typescript @5472052/react @5472052/react-dom @5472052/node

        - This command installs TypeScript and the necessary type definitions for React, ReactDOM, and Node.js. 

            2. Rename the JavaScript files with a .tsx extension. This tells TypeScript that these files contain React components.

            3. Update the imports in your files to reference the correct TypeScript types.

            4. Add a tsconfig.json file to your project's root directory. This file tells TypeScript how to compile your code. 

           5. Modify your code to remove any JavaScript-specific syntax that isn't valid TypeScript. 
           6.         Run npm run build to compile your TypeScript code.

           7. Update your build commands in your pom.xml file to include the necessary TypeScript build commands. You can use the frontend-maven-plugin to do this.

           

        - By following these steps, you should be able to convert your JavaScript app to TypeScript and build it using Maven.

          Terms & ConditionsAccessibility statement

          Loading footer...