So I've been trying to compile tsx files into jsx files and deploy them into a certain folder. I have a web folder which handles the front end and then a backend folder which handles all the backend stuff just for some context. In my web folder I havecreated a react- typescript project and I want to be able to compile it into jsx without tsconfig file. This is what I have in my deploy.sh:
# deploy script for the web front-end
# This file is responsible for preprocessing all TypeScript files, making sure
# all dependencies are up-to-date, and copying all necessary files into the
# web deploy directory.
# This is the resource folder where maven expects to find our files
TARGETFOLDER=../backend/src/main/resources
# This is the folder that we used with the Spark.staticFileLocation command
WEBFOLDERNAME=web
# step 1: make sure we have someplace to put everything. We will delete the
# old folder tree, and then make it from scratch
rm -rf $TARGETFOLDER
mkdir $TARGETFOLDER
mkdir $TARGETFOLDER/$WEBFOLDERNAME
# there are many more steps to be done. For now, we will just copy an HTML file
cp src/index.html $TARGETFOLDER/$WEBFOLDERNAME
# step 2: update our npm dependencies
npm update
# step 3: copy javascript files
cp node_modules/jquery/dist/jquery.min.js $TARGETFOLDER/$WEBFOLDERNAME
# step 4: compile TypeScript files
node_modules/typescript/bin/tsc src/App.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/create.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/Navbar.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/home.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/PostLists.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/index.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/ideaList.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/ideaDetails.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
node_modules/typescript/bin/tsc src/useFetch.tsx --jsx preserve --esModuleInterOp --strict --outFile $TARGETFOLDER/$WEBFOLDERNAME/app.jsx
# step 5: copy css files
cp src/style.css $TARGETFOLDER/$WEBFOLDERNAME
So as you guys can see in step 4 im trying to compile all of my components into their jsx counterparts and move them into a folder but I'm getting compiler error when I run sh deploy.sh that I wouldnt get when I just npm start on my project. Any help or advice on what top do would be greatly appreciated!
EDIT: These are some of the errors I get, which I wouldnt get when I do npm run:
src/home.tsx(10,26): error TS2531: Object is possibly 'null'.
src/IdeaDetails.tsx(11,18): error TS2531: Object is possibly 'null'.
src/IdeaDetails.tsx(12,21): error TS2531: Object is possibly 'null'.
src/IdeaDetails.tsx(21,31): error TS2339: Property 'ideaTitle' does not exist on type 'never'.
src/IdeaDetails.tsx(22,41): error TS2339: Property 'author' does not exist on type 'never'.
src/IdeaDetails.tsx(23,32): error TS2339: Property 'body' does not exist on type 'never'.
src/IdeaDetails.tsx(24,32): error TS2339: Property 'score' does not exist on type 'never'.
src/PostList.tsx(1,1): error TS6131: Cannot compile modules using option 'outFile' unless the '--module' flag is 'amd' or 'system'.
src/create.tsx(1,1): error TS6131: Cannot compile modules using option 'outFile' unless the '--module' flag is 'amd' or 'system'.
I also set typescript from a dev depency to a normal dependency and it still doesnt work. If I do get these compiled in js successfully I have to then run mvn package in order to turn my front end into a jar file so I could then host it on heroku through the backend.