Copyimport { default as NativebaseDocument } from "@native-base/next-adapter/document";import fontsCSS from "@native-base/icons/FontsCSS"import { AppRegistry } from "react-native";import { Main } from "next/document";import * as React from "react";class Document extends NativebaseDocument {//}async function getInitialProps({ renderPage }) {AppRegistry.registerComponent("Main", () => Main);const { getStyleElement } = AppRegistry.getApplication("Main");const page = await renderPage();const styles = [// eslint-disable-next-line react/jsx-key<style dangerouslySetInnerHTML={{ __html: fontsCSS }} />,getStyleElement(),];return { ...page, styles: React.Children.toArray(styles) };}Document.getInitialProps = getInitialProps;export default Document;
Copyimport { default as NativebaseDocument } from "@native-base/next-adapter/document";import AntDesignFontFaceCSS from "@native-base/icons/FontsCSS/AntDesignFontFaceCSS";import MaterialIconsFontFaceCSS from "@native-base/icons/FontsCSS/MaterialIconsFontFaceCSS";const fontsCSS = AntDesignFontFaceCSS + MaterialIconsFontFaceCSS;class Document extends NativebaseDocument {//}async function getInitialProps({ renderPage }) {const res = await NativebaseDocument.getInitialProps({ renderPage });const styles = [// eslint-disable-next-line react/jsx-key<style dangerouslySetInnerHTML={{ __html: fontsCSS }} />,...res.styles];return { ...res, styles: React.Children.toArray(styles) };}Document.getInitialProps = getInitialProps;export default Document;```
Copyconst { withNativebase } = require("@native-base/next-adapter");const path = require("path");module.exports = withNativebase({dependencies: ["@native-base/icons"],nextConfig: {webpack: (config, options) => {config.module.rules.push({test: /\.ttf$/,loader: "url-loader", // or directly file-loaderinclude: path.resolve(__dirname, "node_modules/@native-base/icons"),});config.resolve.alias = {...(config.resolve.alias || {}),"react-native$": "react-native-web",};config.resolve.extensions = [".web.js",".web.ts",".web.tsx",...config.resolve.extensions,];return config;},},});
Copyimport fontsCSS from "@native-base/icons/FontsCSS";const style = document.createElement("style");style.type = "text/css";style.appendChild(document.createTextNode(fontsCSS));document.head.appendChild(style);
Copyimport AntDesignFontFaceCSS from "@native-base/icons/FontsCSS/AntDesignFontFaceCSS";import MaterialIconsFontFaceCSS from "@native-base/icons/FontsCSS/MaterialIconsFontFaceCSS";const fontsCSS = AntDesignFontFaceCSS + MaterialIconsFontFaceCSS;const style = document.createElement("style");style.type = "text/css";if (style.styleSheet) {style.styleSheet.cssText += fontsCSS;} else {style.appendChild(document.createTextNode(fontsCSS));}document.head.appendChild(style);
Copymodule.exports = function (api) {api.cache(true);return {presets: ["babel-preset-expo"],plugins: [["module-resolver",{alias: {"@native-base/icons": "@native-base/icons/lib",},},],],};};
Copyimport { Entypo } from "@native-base/icons";return <Icon as={Entypo} name="user"></Icon>;