parent
130a253024
commit
fc5f5f5fe4
|
@ -31,3 +31,4 @@ dist-ssr
|
|||
!.yarn/releases
|
||||
!.yarn/sdks
|
||||
!.yarn/versions
|
||||
/.tamagui/
|
||||
|
|
|
@ -2,5 +2,6 @@
|
|||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"arrowParens": "avoid",
|
||||
"printWidth": 100
|
||||
"printWidth": 100,
|
||||
"tabWidth": 2
|
||||
}
|
||||
|
|
|
@ -7,6 +7,7 @@
|
|||
<title>Vite + React + TS</title>
|
||||
</head>
|
||||
<body>
|
||||
<script>window.global = window;</script>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
|
|
22
package.json
22
package.json
|
@ -11,17 +11,24 @@
|
|||
"build-storybook": "storybook build",
|
||||
"test-storybook": "test-storybook"
|
||||
},
|
||||
"resolutions": {
|
||||
"@tamagui/web": "1.36.4",
|
||||
"react": "18",
|
||||
"react-dom": "18"
|
||||
},
|
||||
"dependencies": {
|
||||
"@status-im/react": "^0.1.1",
|
||||
"@tamagui/config": "^1.49.1",
|
||||
"@tamagui/vite-plugin": "^1.49.1",
|
||||
"@types/react": "17",
|
||||
"@types/react-dom": "17",
|
||||
"react": "17",
|
||||
"react-dom": "17",
|
||||
"tamagui": "^1.49.1"
|
||||
"@tamagui/config": "1.36.4",
|
||||
"@tamagui/react-17-patch": "1.36.4",
|
||||
"@tamagui/vite-plugin": "1.36.4",
|
||||
"@types/react": "18",
|
||||
"@types/react-dom": "18",
|
||||
"react": "18",
|
||||
"react-dom": "18",
|
||||
"tamagui": "1.36.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@fsouza/prettierd": "^0.24.2",
|
||||
"@storybook/addon-essentials": "^7.2.0",
|
||||
"@storybook/addon-interactions": "^7.2.0",
|
||||
"@storybook/addon-links": "^7.2.0",
|
||||
|
@ -39,6 +46,7 @@
|
|||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.3",
|
||||
"eslint-plugin-storybook": "^0.6.13",
|
||||
"prettier": "^3.0.1",
|
||||
"storybook": "^7.2.0",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.4.5"
|
||||
|
|
17
src/App.tsx
17
src/App.tsx
|
@ -1,13 +1,18 @@
|
|||
import { useState } from 'react'
|
||||
import reactLogo from './assets/react.svg'
|
||||
import viteLogo from '/vite.svg'
|
||||
import { Button, TamaguiProvider } from 'tamagui'
|
||||
import './App.css'
|
||||
import '@tamagui/react-17-patch'
|
||||
|
||||
import config from '../tamagui.config'
|
||||
|
||||
function App() {
|
||||
const [count, setCount] = useState(0)
|
||||
|
||||
return (
|
||||
<>
|
||||
<TamaguiProvider config={config}>
|
||||
<Button size="$6">LEL</Button>
|
||||
<div>
|
||||
<a href="https://vitejs.dev" target="_blank">
|
||||
<img src={viteLogo} className="logo" alt="Vite logo" />
|
||||
|
@ -18,17 +23,13 @@ function App() {
|
|||
</div>
|
||||
<h1>Vite + React</h1>
|
||||
<div className="card">
|
||||
<button onClick={() => setCount((count) => count + 1)}>
|
||||
count is {count}
|
||||
</button>
|
||||
<button onClick={() => setCount(count => count + 1)}>count is {count}</button>
|
||||
<p>
|
||||
Edit <code>src/App.tsx</code> and save to test HMR
|
||||
</p>
|
||||
</div>
|
||||
<p className="read-the-docs">
|
||||
Click on the Vite and React logos to learn more
|
||||
</p>
|
||||
</>
|
||||
<p className="read-the-docs">Click on the Vite and React logos to learn more</p>
|
||||
</TamaguiProvider>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
@ -1,11 +1,10 @@
|
|||
import React from 'react'
|
||||
import ReactDOM from 'react-dom'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App.tsx'
|
||||
import './index.css'
|
||||
|
||||
ReactDOM.render(
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
document.getElementById('root')
|
||||
)
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
import { config } from '@tamagui/config';
|
||||
import { createTamagui } from 'tamagui';
|
||||
import { config } from '@tamagui/config'
|
||||
|
||||
export default createTamagui(config);
|
||||
import { createTamagui } from 'tamagui' // or '@tamagui/core'
|
||||
|
||||
// export type AppConfig = typeof appConfig
|
||||
// declare module 'tamagui' {
|
||||
// interface TamaguiCustomConfig extends AppConfig { }
|
||||
// }
|
||||
// export default appConfig
|
||||
const appConfig = createTamagui(config)
|
||||
export type AppConfig = typeof appConfig
|
||||
declare module 'tamagui' {
|
||||
interface TamaguiCustomConfig extends AppConfig {}
|
||||
}
|
||||
export default appConfig
|
||||
|
|
|
@ -1,15 +1,8 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import { tamaguiPlugin } from '@tamagui/vite-plugin';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react(), tamaguiPlugin({
|
||||
config: './tamagui.config.ts',
|
||||
components: ['tamagui'],
|
||||
}),
|
||||
// optional, adds the optimizing compiler:
|
||||
// tamaguiExtractPlugin(tamaguiConfig),
|
||||
],
|
||||
plugins: [react()],
|
||||
define: {
|
||||
DEV: `${process.env.NODE_ENV === 'development' ? true : false}`,
|
||||
'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
|
||||
|
@ -18,7 +11,7 @@ export default defineConfig({
|
|||
resolve: {
|
||||
alias: {
|
||||
'react-native': 'react-native-web',
|
||||
}
|
||||
},
|
||||
},
|
||||
optimizeDeps: {
|
||||
esbuildOptions: {
|
||||
|
@ -38,4 +31,4 @@ export default defineConfig({
|
|||
},
|
||||
},
|
||||
},
|
||||
});
|
||||
})
|
||||
|
|
Loading…
Reference in New Issue