@aamodtgroup/gutenberg-styles 中文文档教程
Gutenberg styles
此软件包包括来自 Gutenberg 的 style.css 和 theme.css 文件。
How does it work?
- Simply import the styles in your project.
Installation
- Do
npm install @aamodtgroup/gutenberg-stylesin the root of your project.
Use
SCSS utulities and variables
在应用程序的 SCSS 文件中，包括如下样式：
@import 'node_modules/@aamodtgroup/gutenberg-styles/style.css';
@import 'node_modules/@aamodtgroup/gutenberg-styles/theme.css';
如果您将 Webpack 用于 SCSS 管道，则可以使用 ~ 解析为 node_modules：
@import '~@aamodtgroup/gutenberg-styles/style.css';
@import '~@aamodtgroup/gutenberg-styles/theme.css';
要使其与 sass 或没有 Webpack 的 node-sass NPM 模块，你必须使用 includePaths 选项：
{
"includePaths": [ "node_modules" ]
}
Import with
在你的 index.html / main.html 中添加以下内容——以你的主要加载 html 为准。 确保 node_modules 文件夹的路径正确。
<link rel="stylesheet" type="text/css" href="./node_modules/@aamodtgroup/gutenberg-styles/style.css">
<link rel="stylesheet" type="text/css" href="./node_modules/@aamodtgroup/gutenberg-styles/theme.css">
Next js
从 Next.js 9.5.4 开始，您的应用程序中的任何地方都允许从 node_modules 导入 CSS 文件。 对于全局样式表，您应该在 pages/_app.js 中导入文件。 例如：
// pages/_app.js
import '@aamodtgroup/gutenberg-styles/style.css'
import '@aamodtgroup/gutenberg-styles/theme.css'
Authors
- Kasper Aamodt - Owner and developer @aamodtgroup
License
Gutenberg styles
This package includes the style.css and theme.css files from Gutenberg.
How does it work?
- Simply import the styles in your project.
Installation
- Do
npm install @aamodtgroup/gutenberg-stylesin the root of your project.
Use
SCSS utulities and variables
In your application's SCSS file, include styles like so:
@import 'node_modules/@aamodtgroup/gutenberg-styles/style.css';
@import 'node_modules/@aamodtgroup/gutenberg-styles/theme.css';
If you use Webpack for your SCSS pipeline, you can use ~ to resolve to node_modules:
@import '~@aamodtgroup/gutenberg-styles/style.css';
@import '~@aamodtgroup/gutenberg-styles/theme.css';
To make that work with sass or node-sass NPM modules without Webpack, you'd have to use includePaths option:
{
"includePaths": [ "node_modules" ]
}
Import with
Add the following in your index.html / main.html - whichever is your main loading html. Make sure the path to your node_modules folder is correct.
<link rel="stylesheet" type="text/css" href="./node_modules/@aamodtgroup/gutenberg-styles/style.css">
<link rel="stylesheet" type="text/css" href="./node_modules/@aamodtgroup/gutenberg-styles/theme.css">
Next js
Since Next.js 9.5.4, importing a CSS file from node_modules is permitted anywhere in your application. For global stylesheets, you should import the file inside pages/_app.js. For example:
// pages/_app.js
import '@aamodtgroup/gutenberg-styles/style.css'
import '@aamodtgroup/gutenberg-styles/theme.css'
Authors
- Kasper Aamodt - Owner and developer @aamodtgroup
License
