ed81a14922
Found that this rule was added but all options are set to `false` so it doesn't do anything. Started with enabling it for examples to ensure minimal breaking of existing PRs. ## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have helpful link attached, see `contributing.md` ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have helpful link attached, see `contributing.md` ## Documentation / Examples - [ ] Make sure the linting passes by running `pnpm lint` - [ ] The examples guidelines are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples) |
||
|---|---|---|
| .. | ||
| pages | ||
| public | ||
| .gitignore | ||
| App.tsx | ||
| babel.config.js | ||
| next-env.d.ts | ||
| next.config.js | ||
| package.json | ||
| README.md | ||
| tsconfig.json | ||
With Expo TypeScript
This is a starter project for creating universal React apps with Next.js, Expo, and TypeScript.
💡 For the most updated info, see the Expo + Next.js Docs!
- Next.js cannot be used for SSR in your native app.
- The native bundle is built using the Metro bundler and may not have the same level of optimization as the web bundle which is compiled using the Next.js Webpack configuration.
- Expo transpiles
react-native-webpackages by default to enable the use ofreact-nativein a browser or Node.js environment. - All Expo packages work in the browser. If you experience issues using them in a Node environment, please report them here: Expo issues.
- Most community
react-native-*packages do not support web, please refer to reactnative.directory for a list of web compatible packages. - Eject the
pages/_documentcomponent by runningyarn next-expo customize. - To use fonts and images, see the Expo docs.
Deploy your own
Deploy the example using Vercel (web only):
Deploy the native app to the App store and Play store using Expo deployment.
How to use
Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:
npx create-next-app --example with-expo-typescript with-expo-typescript-app
yarn create next-app --example with-expo-typescript with-expo-typescript-app
pnpm create next-app --example with-expo-typescript with-expo-typescript-app
Running web
🚨 Using default Expo web with Next.js is not supported.
- Start the Next.js project with
yarn dev(yarn next dev).
Deploy the web app to the cloud with Vercel (Documentation).
Running native
- Install the Expo CLI
npm i -g expo-cli. - Start the Metro bundler with
yarn iosoryarn android-- This runsexpo startwith the Expo CLI. - You can run the mobile app using the Expo client app, or by running
yarn ejectand building the project manually (this requires a macbook for iOS).
Deploy the native app to the App store and Play store using Expo deployment.
Troubleshooting
You may find that certain packages like @ui-kitten/components do not work in the browser. This is because they need to be transpiled by Next.js, you can fix this by doing the following:
- Install the following:
yarn add -D next-compose-plugins next-transpile-modules
- Modify the Next.js config
next.config.js:
const { withExpo } = require('@expo/next-adapter')
const withPlugins = require('next-compose-plugins')
const withTM = require('next-transpile-modules')([
// Add the name of your package here...
'@ui-kitten/components',
])
module.exports = withPlugins([withTM, [withExpo, { projectRoot: __dirname }]], {
// ...
})