Skip to content
This repository was archived by the owner on Feb 19, 2025. It is now read-only.

Commit 927cdab

Browse files
dandara-navarrodandara-navarro
authored
Merge pull request #43 from ApryseSDK/mics/create-react-app-to-vite
Migrating Create React App Project to Vite Project
2 parents 9b3ff7a + 52f2bc6 commit 927cdab

8 files changed

+45
-20
lines changed

‎public/index.html renamed to ‎index.html

+3-11
Original file line numberDiff line numberDiff line change
@@ -3,30 +3,22 @@
33

44
<head>
55
<meta charset="utf-8" />
6-
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<link rel="icon" href="/favicon.ico" />
77
<meta name="viewport" content="width=device-width, initial-scale=1" />
88
<meta name="theme-color" content="#000000" />
99
<meta name="description" content="Web site created using create-react-app" />
1010
<!--
1111
manifest.json provides metadata used when your web app is installed on a
1212
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
1313
-->
14-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
15-
<!--
16-
Notice the use of %PUBLIC_URL% in the tags above.
17-
It will be replaced with the URL of the `public` folder during the build.
18-
Only files inside the `public` folder can be referenced from the HTML.
19-
20-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
21-
work correctly both with client-side routing and a non-root public URL.
22-
Learn how to configure a non-root public URL by running `npm run build`.
23-
-->
14+
<link rel="manifest" href="/manifest.json" />
2415
<title>React Sample</title>
2516
</head>
2617

2718
<body>
2819
<noscript>You need to enable JavaScript to run this app.</noscript>
2920
<div id="root"></div>
21+
<script type="module" src="/src/index.tsx"></script>
3022
<!--
3123
This HTML file is a template.
3224
If you open it directly in the browser, you will see an empty page.

‎package.json

+16-9
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,25 @@
22
"name": "webviewer-react-sample",
33
"version": "1.0.0",
44
"private": true,
5+
"type": "module",
56
"dependencies": {
67
"@pdftron/webviewer": "^11.0.0",
7-
"@testing-library/jest-dom": "^5.17.0",
8-
"@testing-library/react": "^13.4.0",
8+
"@testing-library/jest-dom": "^6.6.3",
9+
"@testing-library/react": "^16.1.0",
910
"@testing-library/user-event": "^13.5.0",
11+
"@types/fs-extra": "^11.0.4",
12+
"fs-extra": "^11.2.0",
1013
"react": "^18.2.0",
1114
"react-dom": "^18.2.0",
12-
"react-scripts": "^5.0.1",
1315
"web-vitals": "^2.1.4"
1416
},
1517
"scripts": {
16-
"start": "react-scripts start",
17-
"build": "react-scripts build",
18-
"test": "react-scripts test",
19-
"eject": "react-scripts eject",
20-
"postinstall": "node tools/copy-webviewer-files.js"
18+
"start": "vite",
19+
"build": "vite build",
20+
"lint": "eslint .",
21+
"preview": "vite preview",
22+
"test": "vitest",
23+
"postinstall": "node tools/copy-webviewer-files.cjs"
2124
},
2225
"eslintConfig": {
2326
"extends": [
@@ -38,6 +41,10 @@
3841
]
3942
},
4043
"devDependencies": {
41-
"@babel/plugin-proposal-private-property-in-object": "^7.21.11"
44+
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
45+
"@vitejs/plugin-react": "^4.3.4",
46+
"jsdom": "^25.0.1",
47+
"vite": "^6.0.3",
48+
"vitest": "^2.1.8"
4249
}
4350
}

‎src/setupTests.js renamed to ‎setupTests.js

File renamed without changes.

‎src/App.test.js renamed to ‎src/App.test.jsx

+7
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,13 @@
11
import { render, screen } from '@testing-library/react';
22
import App from './App';
33

4+
// Mock fetch globally prventing the error by intercepting all fetch calls and returning mock data.
5+
global.fetch = vi.fn((url) =>
6+
Promise.resolve({
7+
text: () => Promise.resolve(`Mocked fetch content for URL: ${url}`),
8+
})
9+
);
10+
411
test('renders react sample', () => {
512
render(<App />);
613
const linkElement = screen.getByText(/react sample/i);

‎src/App.js renamed to ‎src/App.tsx

File renamed without changes.

‎src/index.js renamed to ‎src/index.tsx

File renamed without changes.

‎tools/copy-webviewer-files.js renamed to ‎tools/copy-webviewer-files.cjs

File renamed without changes.

‎vite.config.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { defineConfig } from 'vite';
2+
import react from '@vitejs/plugin-react';
3+
4+
// https://vitejs.dev/config/
5+
export default defineConfig({
6+
plugins: [react()],
7+
server: {
8+
port: 3000,
9+
open: true,
10+
},
11+
test: {
12+
globals: true,
13+
environment: 'jsdom',
14+
setupFiles: '/setupTests.js',
15+
},
16+
build: {
17+
outDir: 'build',
18+
}
19+
});

0 commit comments

Comments
 (0)