我们 "scripts": {"dev":"vite","build":"tsc && vite build","serve":"vite preview",// 主要配置 触发pre-commit 进行elint stylelint 格式校验"lint":"npm run lint:js && npm run lint:style && npm run lint:prettier","lint:js":"eslint --cache --ext .js,.jsx,.ts,.tsx --format=p...
// 引入创建语言,国际化容器,暂时我们只需要用这两个就可以实现的我们目前的功能import{ createIntl,IntlProvider}from"react-intl";// 我们需要引入antd 的国际化的配置importantdEnUSfrom"antd/lib/locale/en_US";importantdZhCNfrom"antd/lib/locale/zh_CN";// 这是我们项目中中英文的配置,importenLnfrom"....
搭建react+vite+ts yarn create vite vite-project// 启动项目yarn dev//可配置不同环境启动 配置vite.config.ts exportdefaultdefineConfig((mode:ConfigEnv):UserConfig=>{constenv=loadEnv(mode.mode,process.cwd());constviteEnv=wrapperEnv(env);return{resolve:{alias:{"@":resolve(__dirname,"./src")...
import { createRoot } from 'react-dom/client'; import { BrowserRouter } from 'react-router-dom'; // 利用了 HTML5 History API 来实现路由切换。BrowserRouter 创建的 URL 看起来就像常规的 URL,没有额外的字符或哈希(#) import { Provider } from "react-redux";//通过 React 的 context API 将 ...
配置路由表 在src目录下新建router文件夹,并在router下新建index.ts文件,内容如下 import { createHashRouter } from "react-router-dom"; import User from "../pages/user"; const router = createHashRouter([ { path: "/", }, { path: "/user", ...
如果eslint出现报错"vite" is not published和"@vitejs/plugin-react" is not published,则需要在package.json中把这两个依赖从devDependencies移到dependencies内。 如果报错不能使用jsx,则需要tsconfig.compilerOptions中配置"jsx": "react" 如果使用document的地方报错找不到名称“document”,则需要配置"lib": ["es...
2、配置别名路径 image.png import { defineConfig } from 'vite' import react from '@vitejs/plugin-react' import path from 'path' // https://vitejs.dev/config/ export default defineConfig({ plugins: [react()], resolve: { alias: { '@': path.resolve(__dirname,'./src') } } }) ...
npm init @vitejs/app my-react-app -- --template react-ts # yarn yarn create @vitejs/app my-react-app --template react-ts 引入react三件套 这里有兴趣的可以尝试下pnpm包管理工具,安装速度很快,不了解的可以查看pnpm官方文档,相较于传统的npm、yarn工具都有很好的性能提升与使用体验,这里不做过多介...
代码语言:ts 复制 importReactfrom'react';constAbout:React.FC=()=>{return(Welcome to the About page!);};exportdefaultAbout; 现在,我们需要在App.tsx中配置React Router。可以编写以下代码: 代码语言:ts 复制 importReactfrom'react';import{BrowserRouterasRouter,Switch,Route,Link}from'react-router-dom'...