Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore: migrate from create-react-app to vite #5

Closed
wants to merge 16 commits into from
Closed

chore: migrate from create-react-app to vite #5

wants to merge 16 commits into from

Conversation

ayushmanchhabra
Copy link
Contributor

@ayushmanchhabra ayushmanchhabra commented Feb 15, 2024 •
edited
Loading

  • Configured GitHub Actions
  • Configured Dependabot
  • Migrate from react-scripts to vite
  • Volta to use correct Node version
  • Vitest for testing
  • Use nw-builder's managed manifest mode to quickly bootstrap web app
  • End to end NW.js testing using Selenium

@ayushmanchhabra
Copy link
Contributor Author

ayushmanchhabra commented Feb 16, 2024 •
edited
Loading

The built react app imports the javascript and css modules as absolute paths:

./out/nwjs/package.nw/out/react/index.html:

<head>
  <script type="module" crossorigin src="/assets/index-Brj1chng.js"></script>
  <link rel="stylesheet" crossorigin href="/assets/index-BxdD1MKp.css">
</head>

Changing to relative imports resolves the issue and app works as expected.

<head>
  <script type="module" crossorigin src="./assets/index-Brj1chng.js"></script>
  <link rel="stylesheet" crossorigin href="./assets/index-BxdD1MKp.css">
</head>

Images (and by extension other assets) also the same issue.

@ayushmanchhabra ayushmanchhabra marked this pull request as ready for review February 16, 2024 18:44
@ayushmanchhabra
Copy link
Contributor Author

@sysrage requesting your review

@ayushmanchhabra
Copy link
Contributor Author

The built react app imports the javascript and css modules as absolute paths:

./out/nwjs/package.nw/out/react/index.html:

<head>
  <script type="module" crossorigin src="/assets/index-Brj1chng.js"></script>
  <link rel="stylesheet" crossorigin href="/assets/index-BxdD1MKp.css">
</head>

Changing to relative imports resolves the issue and app works as expected.

<head>
  <script type="module" crossorigin src="./assets/index-Brj1chng.js"></script>
  <link rel="stylesheet" crossorigin href="./assets/index-BxdD1MKp.css">
</head>

Images (and by extension other assets) also the same issue.

Resolved this by setting base: "./" in vite.config.js.

@ayushmanchhabra ayushmanchhabra deleted the chore/vite-migration branch February 18, 2024 21:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@sysrage sysrage Awaiting requested review from sysrage

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
1 participant
@ayushmanchhabra