Merge pull request #636 from samhvw8/feat/vite-tailwind

refactor: migrate from CRA to Vite and improve testing

.eslintrc.json

@@ -1,24 +1,56 @@
 {
 	"root": true,
+	"extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
 	"parser": "@typescript-eslint/parser",
 	"parserOptions": {
-		"ecmaVersion": 6,
-		"sourceType": "module"
+		"ecmaVersion": 2021,
+		"sourceType": "module",
+		"project": "./tsconfig.json"
 	},
 	"plugins": ["@typescript-eslint"],
 	"rules": {
-		"@typescript-eslint/naming-convention": [
+		"@typescript-eslint/naming-convention": ["warn"],
+		"@typescript-eslint/no-explicit-any": "off",
+		"@typescript-eslint/no-unused-vars": [
 			"warn",
 			{
-				"selector": "import",
-				"format": ["camelCase", "PascalCase"]
+				"argsIgnorePattern": "^_",
+				"varsIgnorePattern": "^_",
+				"caughtErrorsIgnorePattern": "^_"
 			}
 		],
-		"@typescript-eslint/semi": "off",
-		"eqeqeq": "warn",
+		"@typescript-eslint/explicit-function-return-type": [
+			"warn",
+			{
+				"allowExpressions": true,
+				"allowTypedFunctionExpressions": true
+			}
+		],
+		"@typescript-eslint/explicit-member-accessibility": [
+			"warn",
+			{
+				"accessibility": "explicit"
+			}
+		],
+		"@typescript-eslint/no-non-null-assertion": "warn",
 		"no-throw-literal": "warn",
-		"semi": "off",
-		"react-hooks/exhaustive-deps": "off"
+		"semi": ["off", "always"],
+		"quotes": ["warn", "double", { "avoidEscape": true }],
+		"@typescript-eslint/ban-types": "off",
+		"@typescript-eslint/no-var-requires": "warn",
+		"no-extra-semi": "warn",
+		"prefer-const": "warn",
+		"no-mixed-spaces-and-tabs": "warn",
+		"no-case-declarations": "warn",
+		"no-useless-escape": "warn",
+		"require-yield": "warn",
+		"no-empty": "warn",
+		"no-control-regex": "warn",
+		"@typescript-eslint/ban-ts-comment": "warn"
+	},
+	"env": {
+		"node": true,
+		"es2021": true
 	},
-	"ignorePatterns": ["out", "dist", "**/*.d.ts"]
+	"ignorePatterns": ["dist/**", "out/**", "webview-ui/**", "**/*.js"]
 }

package.json

@@ -214,7 +214,7 @@
 		"compile": "npm run check-types && npm run lint && node esbuild.js",
 		"compile-tests": "tsc -p . --outDir out",
 		"install:all": "npm install && cd webview-ui && npm install",
-		"lint": "eslint src --ext ts && npm run lint --prefix webview-ui",
+		"lint": "eslint src --ext ts --quiet && npm run lint --prefix webview-ui",
 		"package": "npm run build:webview && npm run check-types && npm run lint && node esbuild.js --production",
 		"pretest": "npm run compile-tests && npm run compile && npm run lint",
 		"start:webview": "cd webview-ui && npm run start",

src/core/webview/ClineProvider.ts

@@ -409,15 +409,9 @@ export class ClineProvider implements vscode.WebviewViewProvider {
 		// then convert it to a uri we can use in the webview.
 
 		// The CSS file from the React build output
-		const stylesUri = getUri(webview, this.context.extensionUri, [
-			"webview-ui",
-			"build",
-			"static",
-			"css",
-			"main.css",
-		])
+		const stylesUri = getUri(webview, this.context.extensionUri, ["webview-ui", "build", "assets", "index.css"])
 		// The JS file from the React build output
-		const scriptUri = getUri(webview, this.context.extensionUri, ["webview-ui", "build", "static", "js", "main.js"])
+		const scriptUri = getUri(webview, this.context.extensionUri, ["webview-ui", "build", "assets", "index.js"])
 
 		// The codicon font from the React build output
 		// https://github.com/microsoft/vscode-extension-samples/blob/main/webview-codicons-sample/src/extension.ts

webview-ui/.eslintrc.json

@@ -0,0 +1,40 @@
+{
+	"root": true,
+	"extends": [
+		"eslint:recommended",
+		"plugin:react/recommended",
+		"plugin:@typescript-eslint/recommended",
+		"plugin:react-hooks/recommended"
+	],
+	"parser": "@typescript-eslint/parser",
+	"plugins": ["react", "@typescript-eslint", "react-hooks"],
+	"rules": {
+		"react/react-in-jsx-scope": "off",
+		"@typescript-eslint/explicit-module-boundary-types": "off",
+		"@typescript-eslint/no-explicit-any": "warn",
+		"react/display-name": "warn",
+		"no-case-declarations": "warn",
+		"react/no-unescaped-entities": "warn",
+		"react/jsx-key": "warn",
+		"no-extra-semi": "warn",
+		"@typescript-eslint/no-var-requires": "warn",
+		"@typescript-eslint/no-unused-vars": [
+			"warn",
+			{
+				"argsIgnorePattern": "^_",
+				"varsIgnorePattern": "^_",
+				"caughtErrorsIgnorePattern": "^_"
+			}
+		]
+	},
+	"settings": {
+		"react": {
+			"version": "detect"
+		}
+	},
+	"env": {
+		"browser": true,
+		"es2021": true,
+		"node": true
+	}
+}

webview-ui/index.html

@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Roo Code</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>