From 2930658da0ed7881fba6fe7c125f8cca80f79e64 Mon Sep 17 00:00:00 2001 From: Patrick Tran Date: Tue, 28 Mar 2023 21:20:47 -0700 Subject: [PATCH] Update react templates deps to React v18.x and Vite v4.x --- .../Vite-CSharp/.files/react-ts/.eslintrc | 3 ++ .../Vite-CSharp/.files/react-ts/package.json | 17 ++++++---- .../Vite-CSharp/.files/react-ts/src/main.tsx | 15 ++++----- .../.files/react-ts/vite.config.ts | 27 ++++++++-------- .../Vite-CSharp/.files/react/.eslintrc | 3 ++ .../Vite-CSharp/.files/react/package.json | 9 ++++-- .../Vite-CSharp/.files/react/src/main.jsx | 15 ++++----- .../Vite-CSharp/.files/react/vite.config.js | 27 ++++++++-------- .../Controllers/WeatherForecastController.cs | 32 +++++++++++++------ 9 files changed, 87 insertions(+), 61 deletions(-) create mode 100644 src/templates/Vite-CSharp/.files/react-ts/.eslintrc create mode 100644 src/templates/Vite-CSharp/.files/react/.eslintrc diff --git a/src/templates/Vite-CSharp/.files/react-ts/.eslintrc b/src/templates/Vite-CSharp/.files/react-ts/.eslintrc new file mode 100644 index 0000000..fcf5ef3 --- /dev/null +++ b/src/templates/Vite-CSharp/.files/react-ts/.eslintrc @@ -0,0 +1,3 @@ +{ + "extends": ["react-app"] +} diff --git a/src/templates/Vite-CSharp/.files/react-ts/package.json b/src/templates/Vite-CSharp/.files/react-ts/package.json index 2dea038..411d483 100644 --- a/src/templates/Vite-CSharp/.files/react-ts/package.json +++ b/src/templates/Vite-CSharp/.files/react-ts/package.json @@ -9,14 +9,17 @@ "serve": "vite preview" }, "dependencies": { - "react": "^17.0.0", - "react-dom": "^17.0.0" + "react": "^18.2.0", + "react-dom": "^18.2.0" }, "devDependencies": { - "@types/react": "^17.0.0", - "@types/react-dom": "^17.0.0", - "@vitejs/plugin-react": "^1.0.0", - "typescript": "^4.3.2", - "vite": "^2.6.4" + "@types/node": "^18.15.11", + "@types/react": "^18.0.27", + "@types/react-dom": "^18.0.10", + "@vitejs/plugin-react": "^3.1.0", + "eslint": "^8.36.0", + "eslint-config-react-app": "^7.0.1", + "vite": "^4.1.0", + "vite-plugin-eslint": "^1.8.1" } } \ No newline at end of file diff --git a/src/templates/Vite-CSharp/.files/react-ts/src/main.tsx b/src/templates/Vite-CSharp/.files/react-ts/src/main.tsx index 606a3cf..7467839 100644 --- a/src/templates/Vite-CSharp/.files/react-ts/src/main.tsx +++ b/src/templates/Vite-CSharp/.files/react-ts/src/main.tsx @@ -1,11 +1,10 @@ -import React from 'react' -import ReactDOM from 'react-dom' -import './index.css' -import App from './App' +import React from "react"; +import ReactDOM from "react-dom/client"; +import "./index.css"; +import App from "./App"; -ReactDOM.render( +ReactDOM.createRoot(document.getElementById("root")!).render( - , - document.getElementById('root') -) + +); diff --git a/src/templates/Vite-CSharp/.files/react-ts/vite.config.ts b/src/templates/Vite-CSharp/.files/react-ts/vite.config.ts index 756a3cb..7e7335c 100644 --- a/src/templates/Vite-CSharp/.files/react-ts/vite.config.ts +++ b/src/templates/Vite-CSharp/.files/react-ts/vite.config.ts @@ -1,24 +1,25 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' -import { readFileSync } from 'fs' -import { certFilePath, keyFilePath } from './aspnetcore-https' +import { defineConfig } from "vite"; +import react from "@vitejs/plugin-react"; +import eslint from "vite-plugin-eslint"; +import { readFileSync } from "fs"; +import { certFilePath, keyFilePath } from "./aspnetcore-https"; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [react(), eslint()], server: { https: { key: readFileSync(keyFilePath), - cert: readFileSync(certFilePath) + cert: readFileSync(certFilePath), }, port: 5002, strictPort: true, proxy: { - '/api': { - target: 'https://localhost:5001/', + "/api": { + target: "https://localhost:5001/", changeOrigin: true, - secure: true - } - } - } -}) + secure: true, + }, + }, + }, +}); diff --git a/src/templates/Vite-CSharp/.files/react/.eslintrc b/src/templates/Vite-CSharp/.files/react/.eslintrc new file mode 100644 index 0000000..fcf5ef3 --- /dev/null +++ b/src/templates/Vite-CSharp/.files/react/.eslintrc @@ -0,0 +1,3 @@ +{ + "extends": ["react-app"] +} diff --git a/src/templates/Vite-CSharp/.files/react/package.json b/src/templates/Vite-CSharp/.files/react/package.json index 042d5dc..b88acd7 100644 --- a/src/templates/Vite-CSharp/.files/react/package.json +++ b/src/templates/Vite-CSharp/.files/react/package.json @@ -9,11 +9,14 @@ "serve": "vite preview" }, "dependencies": { - "react": "^17.0.0", - "react-dom": "^17.0.0" + "react": "^18.2.0", + "react-dom": "^18.2.0" }, "devDependencies": { "@vitejs/plugin-react": "^1.0.0", - "vite": "^2.6.4" + "eslint": "^8.36.0", + "eslint-config-react-app": "^7.0.1", + "vite": "^4.1.0", + "vite-plugin-eslint": "^1.8.1" } } \ No newline at end of file diff --git a/src/templates/Vite-CSharp/.files/react/src/main.jsx b/src/templates/Vite-CSharp/.files/react/src/main.jsx index 606a3cf..a4cd95d 100644 --- a/src/templates/Vite-CSharp/.files/react/src/main.jsx +++ b/src/templates/Vite-CSharp/.files/react/src/main.jsx @@ -1,11 +1,10 @@ -import React from 'react' -import ReactDOM from 'react-dom' -import './index.css' -import App from './App' +import React from "react"; +import ReactDOM from "react-dom/client"; +import "./index.css"; +import App from "./App"; -ReactDOM.render( +ReactDOM.createRoot(document.getElementById("root")).render( - , - document.getElementById('root') -) + +); diff --git a/src/templates/Vite-CSharp/.files/react/vite.config.js b/src/templates/Vite-CSharp/.files/react/vite.config.js index 756a3cb..7e7335c 100644 --- a/src/templates/Vite-CSharp/.files/react/vite.config.js +++ b/src/templates/Vite-CSharp/.files/react/vite.config.js @@ -1,24 +1,25 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' -import { readFileSync } from 'fs' -import { certFilePath, keyFilePath } from './aspnetcore-https' +import { defineConfig } from "vite"; +import react from "@vitejs/plugin-react"; +import eslint from "vite-plugin-eslint"; +import { readFileSync } from "fs"; +import { certFilePath, keyFilePath } from "./aspnetcore-https"; // https://vitejs.dev/config/ export default defineConfig({ - plugins: [react()], + plugins: [react(), eslint()], server: { https: { key: readFileSync(keyFilePath), - cert: readFileSync(certFilePath) + cert: readFileSync(certFilePath), }, port: 5002, strictPort: true, proxy: { - '/api': { - target: 'https://localhost:5001/', + "/api": { + target: "https://localhost:5001/", changeOrigin: true, - secure: true - } - } - } -}) + secure: true, + }, + }, + }, +}); diff --git a/src/templates/Vite-CSharp/Controllers/WeatherForecastController.cs b/src/templates/Vite-CSharp/Controllers/WeatherForecastController.cs index 8513005..eea035c 100644 --- a/src/templates/Vite-CSharp/Controllers/WeatherForecastController.cs +++ b/src/templates/Vite-CSharp/Controllers/WeatherForecastController.cs @@ -3,12 +3,21 @@ namespace Vite_CSharp.Controllers; [ApiController] -[Route("[controller]")] +[Route("api/[controller]")] public class WeatherForecastController : ControllerBase { private static readonly string[] Summaries = new[] { - "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching" + "Freezing", + "Bracing", + "Chilly", + "Cool", + "Mild", + "Warm", + "Balmy", + "Hot", + "Sweltering", + "Scorching" }; private readonly ILogger _logger; @@ -21,12 +30,17 @@ public WeatherForecastController(ILogger logger) [HttpGet] public IEnumerable Get() { - return Enumerable.Range(1, 5).Select(index => new WeatherForecast - { - Date = DateTime.Now.AddDays(index), - TemperatureC = Random.Shared.Next(-20, 55), - Summary = Summaries[Random.Shared.Next(Summaries.Length)] - }) - .ToArray(); + return Enumerable + .Range(1, 5) + .Select( + index => + new WeatherForecast + { + Date = DateTime.Now.AddDays(index), + TemperatureC = Random.Shared.Next(-20, 55), + Summary = Summaries[Random.Shared.Next(Summaries.Length)] + } + ) + .ToArray(); } }