sách gpt4 ai đã đi

reactjs - 在 create-react-app 构建中完全包含 Google Web 字体(不弹出)

In lại 作者:行者123 更新时间:2023-12-03 13:33:12 28 4
mua khóa gpt4 Nike

我需要使用 create-react-app 在 React web 应用程序的构建中包含 Google Web 字体。这是因为该应用程序将在没有互联网接入的 WiFi 上提供服务。最直接的解决方案似乎是 google-fonts-webpack-plugin ,但它需要自定义的 webpack 配置。

是否有任何“简单”的解决方案可以自动下载并包含所有网络字体资源,而不需要从 create-react-app 中弹出?

1 Câu trả lời

有多种方法可以做到这一点。

1。导入字体

例如,要使用 Roboto,请执行以下操作

yarn add typeface-roboto

hoặc

npm install typeface-roboto --save

在index.js中:

import "typeface-roboto";

许多开源字体和大多数 Google 字体都有 npm 包。您可以看到所有字体đây 。所有的包都来自dự án .

2。手动下载字体并将其添加到样式表

您可以从fonts.google.com下载字体

fonts.google.com page

现在,您可以将字体放入 src/fonts/Lato.woff 中,并在 index.css 中使用它。

@font-face {
font-family: 'Lato';
src: local('Lato'), url(./fonts/Lato.woff) format('woff');
}

ttf 字体,您应该将 truetype Còn hơn là ttf 作为格式参数

您可以将其导入到 index.js 中以使其可用

import './index.css';

您也可以在 App.css,App.js 中执行这些操作。这是你的偏好。

关于reactjs - 在 create-react-app 构建中完全包含 Google Web 字体(不弹出),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52381240/

28 4 0
Bài viết được đề xuất: python - 如何在 `FormView.get_success_url()`中访问表单数据
Bài viết được đề xuất: Asp.net MVC json hay Json.net?
Bài viết được đề xuất: Spring数据休息和业务规则验证
Bài viết được đề xuất: latex - 如何禁用LaTeX列表项的缩进?
行者123
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com