mirror of
https://github.com/facebook/docusaurus.git
synced 2025-05-12 16:47:26 +02:00
feat(v2): add fonts loaders + webpack resolve.roots (#4198)
see https://github.com/webpack-contrib/css-loader/issues/1256
This commit is contained in:
parent
74a58efe16
commit
2a12869fc0
2 changed files with 18 additions and 1 deletions
|
@ -19,6 +19,7 @@ import {
|
||||||
getCustomBabelConfigFilePath,
|
getCustomBabelConfigFilePath,
|
||||||
getMinimizer,
|
getMinimizer,
|
||||||
} from './utils';
|
} from './utils';
|
||||||
|
import {STATIC_ASSETS_DIR_NAME} from '../constants';
|
||||||
|
|
||||||
const CSS_REGEX = /\.css$/;
|
const CSS_REGEX = /\.css$/;
|
||||||
const CSS_MODULE_REGEX = /\.module\.css$/;
|
const CSS_MODULE_REGEX = /\.module\.css$/;
|
||||||
|
@ -91,6 +92,14 @@ export function createBaseConfig(
|
||||||
resolve: {
|
resolve: {
|
||||||
extensions: ['.wasm', '.mjs', '.js', '.jsx', '.ts', '.tsx', '.json'],
|
extensions: ['.wasm', '.mjs', '.js', '.jsx', '.ts', '.tsx', '.json'],
|
||||||
symlinks: true,
|
symlinks: true,
|
||||||
|
roots: [
|
||||||
|
// Allow resolution of url("/fonts/xyz.ttf") by webpack
|
||||||
|
// See https://webpack.js.org/configuration/resolve/#resolveroots
|
||||||
|
// See https://github.com/webpack-contrib/css-loader/issues/1256
|
||||||
|
path.join(siteDir, STATIC_ASSETS_DIR_NAME),
|
||||||
|
siteDir,
|
||||||
|
process.cwd(),
|
||||||
|
],
|
||||||
alias: {
|
alias: {
|
||||||
'@site': siteDir,
|
'@site': siteDir,
|
||||||
'@generated': generatedFilesDir,
|
'@generated': generatedFilesDir,
|
||||||
|
@ -152,6 +161,7 @@ export function createBaseConfig(
|
||||||
module: {
|
module: {
|
||||||
rules: [
|
rules: [
|
||||||
fileLoaderUtils.rules.images(),
|
fileLoaderUtils.rules.images(),
|
||||||
|
fileLoaderUtils.rules.fonts(),
|
||||||
fileLoaderUtils.rules.media(),
|
fileLoaderUtils.rules.media(),
|
||||||
fileLoaderUtils.rules.svg(),
|
fileLoaderUtils.rules.svg(),
|
||||||
fileLoaderUtils.rules.otherAssets(),
|
fileLoaderUtils.rules.otherAssets(),
|
||||||
|
|
|
@ -235,7 +235,7 @@ export function compile(config: Configuration[]): Promise<Stats.ToJsonOutput> {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
type AssetFolder = 'images' | 'files' | 'medias';
|
type AssetFolder = 'images' | 'files' | 'fonts' | 'medias';
|
||||||
|
|
||||||
// Inspired by https://github.com/gatsbyjs/gatsby/blob/8e6e021014da310b9cc7d02e58c9b3efe938c665/packages/gatsby/src/utils/webpack-utils.ts#L447
|
// Inspired by https://github.com/gatsbyjs/gatsby/blob/8e6e021014da310b9cc7d02e58c9b3efe938c665/packages/gatsby/src/utils/webpack-utils.ts#L447
|
||||||
export function getFileLoaderUtils(): Record<string, any> {
|
export function getFileLoaderUtils(): Record<string, any> {
|
||||||
|
@ -291,6 +291,13 @@ export function getFileLoaderUtils(): Record<string, any> {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
fonts: (): RuleSetRule => {
|
||||||
|
return {
|
||||||
|
use: [loaders.url({folder: 'fonts'})],
|
||||||
|
test: /\.(woff|woff2|eot|ttf|otf)$/,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Loads audio and video and inlines them via a data URI if they are below
|
* Loads audio and video and inlines them via a data URI if they are below
|
||||||
* the size threshold
|
* the size threshold
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue