Generate new project with Vite instead of CRA

Author: azimux

.ruby-version

@@ -1 +1 @@
-3.4.5
+3.4.7

CHANGELOG.md

@@ -1,3 +1,7 @@
+## [0.2.0] - 2026-03-19
+
+- Switch to generating the project with Vite instead of CRA
+
 ## [0.1.0] - 2025-08-22
 
 - Mark as compatible with Foobara 0.1.0

Gemfile.lock

@@ -1,44 +1,46 @@
 PATH
   remote: .
   specs:
-    foobara-empty-typescript-react-project-generator (0.1.0)
+    foobara-empty-typescript-react-project-generator (0.2.0)
       foobara (>= 0.1.1, < 2.0.0)
       foobara-files-generator (< 2.0.0)
 
 GEM
   remote: https://rubygems.org/
   specs:
+    addressable (2.8.9)
+      public_suffix (>= 2.0.2, < 8.0)
     ast (2.4.3)
-    bigdecimal (3.2.2)
-    byebug (12.0.0)
+    bigdecimal (4.0.1)
+    byebug (13.0.0)
+      reline (>= 0.6.0)
     coderay (1.1.3)
     diff-lcs (1.6.2)
     docile (1.4.1)
-    ffi (1.17.2-x86_64-linux-gnu)
-    foobara (0.1.1)
+    ffi (1.17.3-x86_64-linux-gnu)
+    foobara (0.5.9)
       bigdecimal
       foobara-lru-cache (< 2.0.0)
       foobara-util (< 2.0.0)
       inheritable-thread-vars (< 2.0.0)
-    foobara-files-generator (0.1.0)
+    foobara-files-generator (0.1.2)
       foobara (>= 0.1.1, < 2.0.0)
     foobara-lru-cache (1.0.0)
-    foobara-rubocop-rules (1.0.1)
+    foobara-rubocop-rules (1.0.12)
       rubocop
       rubocop-rspec
-    foobara-spec-helpers (0.0.4)
+    foobara-spec-helpers (0.1.0)
       foobara-util
-    foobara-util (1.0.2)
-    formatador (1.2.0)
+    foobara-util (1.0.8)
+    formatador (1.2.3)
       reline
-    guard (2.19.1)
+    guard (2.20.1)
       formatador (>= 0.2.4)
       listen (>= 2.7, < 4.0)
       logger (~> 1.6)
       lumberjack (>= 1.0.12, < 2.0)
       nenv (~> 0.1)
       notiffany (~> 0.0)
-      ostruct (~> 0.6)
       pry (>= 0.13.0)
       shellany (~> 0.0)
       thor (>= 0.18.1)
@@ -48,77 +50,85 @@ GEM
       guard-compat (~> 1.1)
       rspec (>= 2.99.0, < 4.0)
     inheritable-thread-vars (0.0.3)
-    io-console (0.8.1)
-    json (2.13.2)
+    io-console (0.8.2)
+    json (2.19.2)
+    json-schema (6.2.0)
+      addressable (~> 2.8)
+      bigdecimal (>= 3.1, < 5)
     language_server-protocol (3.17.0.5)
     lint_roller (1.1.0)
-    listen (3.9.0)
+    listen (3.10.0)
+      logger
       rb-fsevent (~> 0.10, >= 0.10.3)
       rb-inotify (~> 0.9, >= 0.9.10)
     logger (1.7.0)
-    lumberjack (1.4.0)
+    lumberjack (1.4.2)
+    mcp (0.8.0)
+      json-schema (>= 4.1)
     method_source (1.1.0)
     nenv (0.3.0)
     notiffany (0.1.3)
       nenv (~> 0.1)
       shellany (~> 0.0)
-    ostruct (0.6.3)
     parallel (1.27.0)
-    parser (3.3.9.0)
+    parser (3.3.10.2)
       ast (~> 2.4.1)
       racc
-    prism (1.4.0)
-    pry (0.15.2)
+    prism (1.9.0)
+    pry (0.16.0)
       coderay (~> 1.1)
       method_source (~> 1.0)
-    pry-byebug (3.11.0)
-      byebug (~> 12.0)
-      pry (>= 0.13, < 0.16)
+      reline (>= 0.6.0)
+    pry-byebug (3.12.0)
+      byebug (~> 13.0)
+      pry (>= 0.13, < 0.17)
+    public_suffix (7.0.5)
     racc (1.8.1)
     rainbow (3.1.1)
-    rake (13.3.0)
+    rake (13.3.1)
     rb-fsevent (0.11.2)
     rb-inotify (0.11.1)
       ffi (~> 1.0)
-    regexp_parser (2.11.2)
-    reline (0.6.2)
+    regexp_parser (2.11.3)
+    reline (0.6.3)
       io-console (~> 0.5)
-    rspec (3.13.1)
+    rspec (3.13.2)
       rspec-core (~> 3.13.0)
       rspec-expectations (~> 3.13.0)
       rspec-mocks (~> 3.13.0)
-    rspec-core (3.13.5)
+    rspec-core (3.13.6)
       rspec-support (~> 3.13.0)
     rspec-expectations (3.13.5)
       diff-lcs (>= 1.2.0, < 2.0)
       rspec-support (~> 3.13.0)
     rspec-its (2.0.0)
       rspec-core (>= 3.13.0)
       rspec-expectations (>= 3.13.0)
-    rspec-mocks (3.13.5)
+    rspec-mocks (3.13.8)
       diff-lcs (>= 1.2.0, < 2.0)
       rspec-support (~> 3.13.0)
-    rspec-support (3.13.5)
-    rubocop (1.80.0)
+    rspec-support (3.13.7)
+    rubocop (1.85.1)
       json (~> 2.3)
       language_server-protocol (~> 3.17.0.2)
       lint_roller (~> 1.1.0)
+      mcp (~> 0.6)
       parallel (~> 1.10)
       parser (>= 3.3.0.2)
       rainbow (>= 2.2.2, < 4.0)
       regexp_parser (>= 2.9.3, < 3.0)
-      rubocop-ast (>= 1.46.0, < 2.0)
+      rubocop-ast (>= 1.49.0, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 2.4.0, < 4.0)
-    rubocop-ast (1.46.0)
+    rubocop-ast (1.49.1)
       parser (>= 3.3.7.2)
-      prism (~> 1.4)
+      prism (~> 1.7)
     rubocop-rake (0.7.1)
       lint_roller (~> 1.1)
       rubocop (>= 1.72.1)
-    rubocop-rspec (3.6.0)
+    rubocop-rspec (3.9.0)
       lint_roller (~> 1.1)
-      rubocop (~> 1.72, >= 1.72.1)
+      rubocop (~> 1.81)
     ruby-progressbar (1.13.0)
     shellany (0.0.1)
     simplecov (0.22.0)
@@ -127,10 +137,10 @@ GEM
       simplecov_json_formatter (~> 0.1)
     simplecov-html (0.13.2)
     simplecov_json_formatter (0.1.4)
-    thor (1.4.0)
-    unicode-display_width (3.1.5)
-      unicode-emoji (~> 4.0, >= 4.0.4)
-    unicode-emoji (4.0.4)
+    thor (1.5.0)
+    unicode-display_width (3.2.0)
+      unicode-emoji (~> 4.1)
+    unicode-emoji (4.2.0)
 
 PLATFORMS
   x86_64-linux

spec/foobara/generators/generate_empty_typescript_react_project_spec.rb

@@ -13,6 +13,6 @@
   it "generates a empty_typescript_react_project" do
     expect(outcome).to be_success
 
-    expect(result.keys).to contain_exactly(".env", ".eslintrc.js", ".github/workflows/tests.yml", "tsconfig.json")
+    expect(result.keys).to contain_exactly(".env", "eslint.config.js", ".github/workflows/tests.yml")
   end
 end

spec/foobara/generators/write_empty_typescript_react_project_to_disk_spec.rb

@@ -31,7 +31,6 @@
     it "contains base files" do
       expect(outcome).to be_success
 
-      expect(File.exist?("#{output_directory}/#{project_dir}/.eslintrc.js")).to be(true)
       expect(File.exist?("#{output_directory}/#{project_dir}/.github/workflows/tests.yml")).to be(true)
     end
   end

src/write_empty_typescript_react_project_to_disk.rb

@@ -54,19 +54,18 @@ def generate_file_contents
         end
 
         def run_pre_generation_tasks
-          run_npx_create_react_app
-          add_necessary_dev_dependencies_for_eslint
-          fix_uncorrectable_lint_violations
+          run_npm_create_vite
+          npm_install
           eslint_fix
           git_init
           git_add_all
-          git_commit_lint_fixes
+          git_commit_initial_setup
         end
 
-        def run_npx_create_react_app
-          puts "created empty project with create-react-app..."
+        def run_npm_create_vite
+          puts "creating empty project with Vite..."
 
-          cmd = "npx create-react-app --template typescript #{empty_typescript_react_project_config.project_dir}"
+          cmd = "npm create vite@latest #{empty_typescript_react_project_config.project_dir} -- --template react-ts"
 
           FileUtils.mkdir_p output_parent_directory
 
@@ -75,16 +74,10 @@ def run_npx_create_react_app
           end
         end
 
-        def add_necessary_dev_dependencies_for_eslint
-          puts "adding dependencies needed for linter to actually work..."
+        def npm_install
+          puts "installing dependencies..."
 
-          cmd = "npm install --save-dev " \
-                "@babel/plugin-proposal-private-property-in-object@^7.21.11 " \
-                "@eslint/create-config@^0.4.6 " \
-                "eslint-config-standard-with-typescript@^37.0.0 " \
-                "eslint-plugin-n@^16.5.0 " \
-                "eslint-plugin-promise@^6.1.1 " \
-                "typescript@^4.0.0 "
+          cmd = "npm install"
 
           Dir.chdir project_directory do
             run_cmd_and_write_output(cmd)
@@ -104,18 +97,10 @@ def run_post_generation_tasks
           end
         end
 
-        def fix_uncorrectable_lint_violations
-          Dir.chdir(project_directory) do
-            web_vitals_contents = File.read("src/reportWebVitals.ts")
-            web_vitals_contents.gsub!("if (onPerfEntry && ", "if (onPerfEntry != null && ")
-            File.write("src/reportWebVitals.ts", web_vitals_contents)
-          end
-        end
-
         def eslint_fix
           puts "linting..."
 
-          cmd = "npx eslint 'src/**/*.{js,jsx,ts,tsx}' --fix"
+          cmd = "npx eslint . --fix"
           Dir.chdir project_directory do
             run_cmd_and_write_output(cmd)
           end
@@ -137,8 +122,8 @@ def git_add_all
           end
         end
 
-        def git_commit_lint_fixes
-          cmd = "git commit -m 'Make project work with eslint and eslint --fix everything'"
+        def git_commit_initial_setup
+          cmd = "git commit -m 'Initial Vite project with react-ts template'"
 
           Dir.chdir project_directory do
             run_cmd_and_write_output(cmd, raise_if_fails: false)

templates/.eslintrc.js

@@ -3,16 +3,17 @@ on: push
 jobs:
   tests:
     runs-on: ubuntu-latest
-    name: run test suite
+    name: build and lint
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
       - name: Use Node.js
         if: always()
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v4
         with:
-          # how to grab this from .nvmrc??
-          node-version: "20.9"
+          node-version: "20"
       - name: Install dependencies
         run: npm install
-      - name: Run test
-        run: npm run test
+      - name: Lint
+        run: npm run lint
+      - name: Build
+        run: npm run build

templates/.github/workflows/tests.yml

@@ -0,0 +1,30 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      js.configs.recommended,
+      tseslint.configs.recommended,
+      reactHooks.configs.flat.recommended,
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+  },
+  {
+    files: ['src/domains/**/*.{ts,tsx}'],
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'off',
+      '@typescript-eslint/prefer-as-const': 'off',
+    },
+  },
+])