laststance / vite-rtk-query Goto Github PK
View Code? Open in Web Editor NEWVite template for React + TypeScript + Redux-Toolkit / RTK Query.
License: MIT License
Vite template for React + TypeScript + Redux-Toolkit / RTK Query.
License: MIT License
Hello,
We've tried to activate or update your repository on Depfu and couldn't find any supported dependency files. If we were to guess, we would say that this is not actually a project Depfu supports and has probably been activated by error.
Please note that Depfu currently only searches for your dependency files in the root folder. We do support monorepos and non-root files, but don't auto-detect them. If that's the case with this repo, please send us a quick email with the folder you want Depfu to work on and we'll set it up right away!
Please note that using the "All Repositories" setting doesn't make a lot of sense with Depfu.
Please let us know by sending an email to [email protected].
This is an automated issue by Depfu. You're getting it because someone configured Depfu to automatically update dependencies on this project.
There is an error with this repository's Renovate configuration that needs to be fixed. As a precaution, Renovate will stop PRs until it is resolved.
Location: renovate.json
Error type: The renovate configuration file contains some invalid settings
Message: Invalid configuration option: packageRules[0].npmInstallOptions
This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.
These updates are awaiting their schedule. Click on a checkbox to get an update now.
.github/workflows/build.yml
actions/checkout v3
actions/setup-node v2-beta
.github/workflows/lint.yml
actions/checkout v3
actions/setup-node v2-beta
.github/workflows/test.yml
actions/checkout v3
actions/setup-node v2-beta
.github/workflows/typecheck.yml
actions/checkout v3
actions/setup-node v2-beta
package.json
@reduxjs/toolkit ^2.0.0-alpha.6
clsx ^2.0.0
history ^5.3.0
ky ^0.33.3
react ^18.2.0
react-dom ^18.2.0
react-redux ^8.1.1
react-router-dom ^6.15.0
redux 5.0.0-beta.0
redux-first-history ^5.1.1
@tailwindcss/aspect-ratio ^0.4.2
@tailwindcss/forms ^0.5.4
@tailwindcss/line-clamp ^0.4.4
@tailwindcss/typography ^0.5.9
@testing-library/dom ^9.3.1
@testing-library/jest-dom ^6.0.0
@testing-library/react ^14.0.0
@testing-library/user-event ^14.4.3
@types/node ^20.4.5
@types/react ^18.2.17
@types/react-dom ^18.2.7
@types/testing-library__jest-dom ^5.14.9
@typescript-eslint/eslint-plugin ^6.3.0
@typescript-eslint/parser ^6.3.0
@vitejs/plugin-react ^4.0.3
all-contributors-cli ^6.26.1
autoprefixer ^10.4.14
concurrently ^8.2.0
eslint ^8.46.0
eslint-config-prettier ^9.0.0
eslint-config-ts-prefixer ^0.25.0
eslint-config-typescript ^3.0.0
eslint-import-resolver-typescript ^3.6.0
eslint-plugin-import ^2.28.0
eslint-plugin-jsx-a11y ^6.7.1
eslint-plugin-prettier ^5.0.0
eslint-plugin-react-hooks ^4.6.0
eslint-plugin-sort-keys-fix ^1.1.2
jsdom ^22.1.0
msw ^1.2.3
node-fetch ^3.3.2
postcss ^8.4.27
postcss-import ^15.1.0
postcss-nesting ^12.0.1
prettier ^3.0.1
prettier-plugin-tailwindcss ^0.5.0
serve ^14.2.0
tailwindcss ^3.3.3
typescript ^5.1.6
vite ^4.4.7
vitest ^0.34.0
Thank you for taking the time to provide a template for using Redux Toolkit with Vite in a React application. I appreciate your effort in creating this solution.
In my case, I do not require Tailwind CSS in the template. I feel that Tailwind CSS may not be necessary for certain projects that I am working on.. However, I think the solution would be more suitable for my needs if we remove this addition and focus solely on the integration of Redux Toolkit with Vite and Typescript in a React application.
Thank you.
As my concern, do we need to integrate redux-persist in case we need to keep redux state?
on dev it looks great,
but after running pnpm build
it shows only a white page with no errors in the console.
(I didn't touch the code, I just downloaded, built, and running on local live server)
BTW, the pnpm validate
command get an error:
./scripts/validate
'.' is not recognized as an internal or external command
###The Problem:
When you creating an api slice using createApi method from rtk(specific version for react import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
) it's dose not provide any hook for export from api slice.
##Steps to reproduce:
Clone this repo, add example code from rtk with pockemon api.
// Need to use the React-specific entry point to allow generating React hooks
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
import type { Pokemon } from './types'
// Define a service using a base URL and expected endpoints
export const pokemonApi = createApi({
reducerPath: 'pokemonApi',
baseQuery: fetchBaseQuery({ baseUrl: 'https://pokeapi.co/api/v2/' }),
endpoints: (builder) => ({
getPokemonByName: builder.query<Pokemon, string>({
query: (name) => `pokemon/${name}`,
}),
}),
})
// Export hooks for usage in function components, which are
// auto-generated based on the defined endpoints
export const { useGetPokemonByNameQuery } = pokemonApi
Try to export useGetPokemonByNameQuery
and you will see that it's type is any
As I understood after research, it's because of vite version.
Dose someone know how to fix this?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.