Skip to content

Commit

Permalink
refactor: migrate react-script in the sso-tab template (TS & JS) to v…
Browse files Browse the repository at this point in the history
…ite (#12332)
  • Loading branch information
Yimin-Jin authored Sep 5, 2024
1 parent 2561913 commit 8f32482
Show file tree
Hide file tree
Showing 13 changed files with 137 additions and 36 deletions.
2 changes: 1 addition & 1 deletion templates/js/sso-tab-with-obo-flow/.vscode/tasks.json
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@
"background": {
"activeOnStart": true,
"beginsPattern": ".*",
"endsPattern": "Compiled|Failed|compiled|failed"
"endsPattern": "Compiled|Failed|compiled|failed|ready"
}
}
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<link rel="icon" href="/favicon.ico" />
<link
rel="stylesheet"
href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/11.0.0/css/fabric.min.css"
Expand All @@ -13,5 +13,6 @@
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script type="module" src="/src/index.jsx"></script>
</body>
</html>
15 changes: 9 additions & 6 deletions templates/js/sso-tab-with-obo-flow/package.json.tpl
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
"engines": {
"node": "18 || 20"
},
"type": "module",
"private": true,
"dependencies": {
"@fluentui/react-components": "^9.18.0",
Expand All @@ -13,25 +14,27 @@
"axios": "^0.21.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.8.0",
"react-scripts": "^5.0.1"
"react-router-dom": "^6.8.0"
},
"devDependencies": {
"@types/node": "^18.0.0",
"@types/react": "^18.0.0",
"@types/react-dom": "^18.0.0",
"@types/react-router-dom": "^5.3.3",
"concurrently": "^8.2.2",
"env-cmd": "^10.1.0"
"env-cmd": "^10.1.0",
"vite": "^5.4.2",
"@vitejs/plugin-basic-ssl": "^1.1.0",
"@vitejs/plugin-react": "^4.3.1"
},
"scripts": {
"dev:teamsfx": "concurrently \"npm run dev-tab:teamsfx\" \"npm run dev-api:teamsfx\"",
"dev-tab:teamsfx": "env-cmd --silent -f .localConfigs npm run start",
"dev-api:teamsfx": "cd api && npm run dev:teamsfx",
"start": "react-scripts start",
"build": "react-scripts build",
"start": "vite",
"build": "vite build",
"test": "echo \"Error: no test specified\" && exit 1",
"eject": "react-scripts eject"
"serve": "vite preview"
},
"eslintConfig": {
"extends": [
Expand Down
2 changes: 1 addition & 1 deletion templates/js/sso-tab-with-obo-flow/teamsapp.yml.tpl
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ deploy:
- uses: cli/runNpxCommand
name: deploy to Azure Static Web Apps
with:
args: '@azure/static-web-apps-cli deploy ./build -d ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
args: '@azure/static-web-apps-cli deploy ./dist -d ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
# Run npm command
- uses: cli/runNpmCommand
name: install dependencies
Expand Down
30 changes: 30 additions & 0 deletions templates/js/sso-tab-with-obo-flow/vite.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { defineConfig, loadEnv } from "vite";
import react from "@vitejs/plugin-react";
import fs from "fs";

const cherryPickedKeys = [
"REACT_APP_CLIENT_ID",
"REACT_APP_START_LOGIN_PAGE_URL",
"REACT_APP_FUNC_NAME",
"REACT_APP_FUNC_ENDPOINT",
];

export default defineConfig(({ mode }) => {
const env = loadEnv(mode, process.cwd(), "");
const processEnv = {};
cherryPickedKeys.forEach((key) => (processEnv[key] = env[key]));

return {
define: {
"process.env": processEnv,
},
plugins: [react()],
server: {
port: 53000,
https: {
cert: process.env.SSL_CRT_FILE ? fs.readFileSync(process.env.SSL_CRT_FILE) : undefined,
key: process.env.SSL_KEY_FILE ? fs.readFileSync(process.env.SSL_KEY_FILE) : undefined,
},
},
};
});
2 changes: 1 addition & 1 deletion templates/ts/sso-tab-with-obo-flow/.vscode/tasks.json
Original file line number Diff line number Diff line change
Expand Up @@ -78,7 +78,7 @@
"background": {
"activeOnStart": true,
"beginsPattern": ".*",
"endsPattern": "Compiled|Failed|compiled|failed"
"endsPattern": "Compiled|Failed|compiled|failed|ready"
}
}
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<link rel="icon" href="/favicon.ico" />
<link
rel="stylesheet"
href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-core/11.0.0/css/fabric.min.css"
Expand All @@ -13,5 +13,6 @@
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script type="module" src="/src/index.tsx"></script>
</body>
</html>
15 changes: 9 additions & 6 deletions templates/ts/sso-tab-with-obo-flow/package.json.tpl
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
"engines": {
"node": "18 || 20"
},
"type": "module",
"private": true,
"dependencies": {
"@fluentui/react-components": "^9.18.0",
Expand All @@ -13,8 +14,7 @@
"axios": "^0.21.1",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router-dom": "^6.8.0",
"react-scripts": "^5.0.1"
"react-router-dom": "^6.8.0"
},
"devDependencies": {
"@types/node": "^18.0.0",
Expand All @@ -23,16 +23,19 @@
"@types/react-router-dom": "^5.3.3",
"concurrently": "^8.2.2",
"env-cmd": "^10.1.0",
"typescript": "^4.1.2"
"typescript": "^4.1.2",
"vite": "^5.4.2",
"@vitejs/plugin-basic-ssl": "^1.1.0",
"@vitejs/plugin-react": "^4.3.1"
},
"scripts": {
"dev:teamsfx": "concurrently \"npm run dev-tab:teamsfx\" \"npm run dev-api:teamsfx\"",
"dev-tab:teamsfx": "env-cmd --silent -f .localConfigs npm run start",
"dev-api:teamsfx": "cd api && npm run dev:teamsfx",
"start": "react-scripts start",
"build": "react-scripts build",
"start": "vite",
"build": "tsc && vite build",
"test": "echo \"Error: no test specified\" && exit 1",
"eject": "react-scripts eject"
"serve": "vite preview"
},
"eslintConfig": {
"extends": [
Expand Down
2 changes: 1 addition & 1 deletion templates/ts/sso-tab-with-obo-flow/teamsapp.yml.tpl
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ deploy:
- uses: cli/runNpxCommand
name: deploy to Azure Static Web Apps
with:
args: '@azure/static-web-apps-cli deploy ./build -d ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
args: '@azure/static-web-apps-cli deploy ./dist -d ${{SECRET_TAB_SWA_DEPLOYMENT_TOKEN}} --env production'
# Run npm command
- uses: cli/runNpmCommand
name: install dependencies
Expand Down
24 changes: 24 additions & 0 deletions templates/ts/sso-tab-with-obo-flow/tsconfig.app.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,

/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
"jsx": "react-jsx",

/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src"]
}
23 changes: 5 additions & 18 deletions templates/ts/sso-tab-with-obo-flow/tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,20 +1,7 @@
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["src"]
"files": [],
"references": [
{ "path": "./tsconfig.app.json" },
{ "path": "./tsconfig.node.json" }
]
}
22 changes: 22 additions & 0 deletions templates/ts/sso-tab-with-obo-flow/tsconfig.node.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"compilerOptions": {
"target": "ES2022",
"lib": ["ES2023"],
"module": "ESNext",
"skipLibCheck": true,

/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,

/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["vite.config.ts"]
}
30 changes: 30 additions & 0 deletions templates/ts/sso-tab-with-obo-flow/vite.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { defineConfig, loadEnv } from "vite";
import react from "@vitejs/plugin-react";
import fs from "fs";

const cherryPickedKeys = [
"REACT_APP_CLIENT_ID",
"REACT_APP_START_LOGIN_PAGE_URL",
"REACT_APP_FUNC_NAME",
"REACT_APP_FUNC_ENDPOINT",
];

export default defineConfig(({ mode }) => {
const env = loadEnv(mode, process.cwd(), "");
const processEnv = {};
cherryPickedKeys.forEach((key) => (processEnv[key] = env[key]));

return {
define: {
"process.env": processEnv,
},
plugins: [react()],
server: {
port: 53000,
https: {
cert: process.env.SSL_CRT_FILE ? fs.readFileSync(process.env.SSL_CRT_FILE) : undefined,
key: process.env.SSL_KEY_FILE ? fs.readFileSync(process.env.SSL_KEY_FILE) : undefined,
},
},
};
});

0 comments on commit 8f32482

Please sign in to comment.