Skip to content

FW-6462: Update ion-docs to React v19 #4196

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 16 commits into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 32 additions & 26 deletions cspell.json
Original file line number Diff line number Diff line change
@@ -1,26 +1,32 @@
{
"dictionaries": ["custom-words"],
"dictionaryDefinitions": [
{
"name": "custom-words",
"path": "./cspell-wordlist.txt",
"addWords": true
}
],
"ignoreRegExpList": [
"/(```+)[\\s\\S]+?\\1/g",
"`([^`]*)`",
"/:[a-zA-Z0-9-_\\+]+:/g"
],
"ignorePaths": [
"docs/cli",
"docs/native",
"versioned_docs/**/api",
"versioned_docs/**/cli",
"versioned_docs/**/native",
"node_modules"
],
"flagWords": [
"hte"
]
}
{
"dictionaries": ["custom-words"],
"dictionaryDefinitions": [
{
"name": "custom-words",
"path": "./cspell-wordlist.txt",
"addWords": true
}
],
"ignoreRegExpList": [
"/(```+)[\\s\\S]+?\\1/g",
"`([^`]*)`",
"/:[a-zA-Z0-9-_\\+]+:/g"
],
"ignorePaths": [
"docs/cli",
"docs/native",
"versioned_docs/**/api",
"versioned_docs/**/cli",
"versioned_docs/**/native",
"node_modules"
],
"flagWords": [
"hte"
],
"words": [
"tappable",
"Overscroll",
"expressjs",
"browserslistrc"
]
}
2 changes: 1 addition & 1 deletion docs/core-concepts/webview.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ import { Capacitor } from '@capacitor/core';
Capacitor.convertFileSrc(filePath);
```

For Cordova apps, the [Ionic Web View plugin](https://github.com/ionic-team/cordova-plugin-ionic-webview) provides a utility function for converting File URIs: `window.Ionic.WebView.convertFileSrc()`. There is also a corresponding Ionic Native plugin: [`@awesome-cordova-plugins/ionic-webview`](../native/ionic-webview.md).
For Cordova apps, the [Ionic Web View plugin](https://github.com/ionic-team/cordova-plugin-ionic-webview) provides a utility function for converting File URIs: `window.Ionic.WebView.convertFileSrc()`. There is also a corresponding Ionic Native plugin: [`@awesome-cordova-plugins/ionic-webview`](https://danielsogl.gitbook.io/awesome-cordova-plugins/ionic-webview).

### Implementations

Expand Down
84 changes: 10 additions & 74 deletions docusaurus.config.js
Original file line number Diff line number Diff line change
@@ -1,35 +1,10 @@
const path = require('path');
const prismic = require('@prismicio/client');
const fetch = require('node-fetch');

const VERSIONS_JSON = require('./versions.json');

/**
* Old versions of the Ionic Docs are archived so
* that we do not need to re-build it every time we deploy.
* Building a large number of docs sites at once can cause
* out of memory issues, so archiving old docs sites
* allow us to keep memory usage and build times low.
*
* Note that this file is only for versions of the Ionic Docs
* that are built with Docusaurus. The
* Ionic v3 and v4 docs are built with other tools, so those
* versions are not included here.
*
* Note that the urls specified in this file should
* NOT have a trailing slash otherwise users will
* briefly get a 404 Page Not Found error before
* the docuementation website loads.
*/
const ARCHIVED_VERSIONS_JSON = require('./versionsArchived.json');

/**
* This returns an array where each entry is an array
* containing the version name at index 0 and
* the archive url at index 1.
*/
const ArchivedVersionsDropdownItems = Object.entries(ARCHIVED_VERSIONS_JSON).splice(0, 5);

const BASE_URL = '/docs';

module.exports = {
Expand All @@ -51,12 +26,12 @@ module.exports = {
favicon: 'img/meta/favicon-96x96.png',
organizationName: 'ionic-team',
projectName: 'ionic-docs',

presets: [
[
'@docusaurus/preset-classic',
/** @type {import('@docusaurus/preset-classic').Options} */
{
// Will be passed to @docusaurus/plugin-content-docs (false to disable).
docs: {
routeBasePath: '/',
sidebarPath: require.resolve('./sidebars.js'),
Expand All @@ -81,18 +56,15 @@ module.exports = {
},
exclude: ['README.md'],
lastVersion: 'current',
/** @type {import('@docusaurus/plugin-content-docs').VersionOptions} */
versions: {
current: {
label: 'v8',
},
},
},
// Will be passed to @docusaurus/plugin-google-tag-manager.
googleTagManager: {
containerId: 'GTM-TKMGCBC',
},
// Will be passed to @docusaurus/theme-classic.
theme: {
customCss: [
require.resolve('./node_modules/modern-normalize/modern-normalize.css'),
Expand All @@ -103,6 +75,7 @@ module.exports = {
},
],
],

/** @type {import('@docusaurus/preset-classic').ThemeConfig} */
themeConfig: {
announcementBar: {
Expand All @@ -114,34 +87,13 @@ module.exports = {
metadata: [
{ name: 'og:image', content: 'https://ionicframework.com/docs/img/meta/open-graph.png' },
{ name: 'twitter:image', content: 'https://ionicframework.com/docs/img/meta/open-graph.png' },
{
name: 'twitter:card',
content: 'summary_large_image',
},
{
name: 'twitter:domain',
content: 'ionicframework.com',
},
{
name: 'twitter:site',
content: '@ionicframework',
},
{
name: 'twitter:creator',
content: 'ionicframework',
},
{
name: 'fb:page_id',
content: '1321836767955949',
},
{
name: 'og:type',
content: 'website',
},
{
name: 'og:site_name',
content: 'Ionic Framework Docs',
},
{ name: 'twitter:card', content: 'summary_large_image' },
{ name: 'twitter:domain', content: 'ionicframework.com' },
{ name: 'twitter:site', content: '@ionicframework' },
{ name: 'twitter:creator', content: 'ionicframework' },
{ name: 'fb:page_id', content: '1321836767955949' },
{ name: 'og:type', content: 'website' },
{ name: 'og:site_name', content: 'Ionic Framework Docs' },
],
colorMode: {
defaultMode: 'light',
Expand Down Expand Up @@ -195,22 +147,12 @@ module.exports = {
dropdownItemsAfter: [
...ArchivedVersionsDropdownItems.map(([versionName, versionUrl]) => ({
label: versionName,
/**
* Use "to" instead of "href" so the
* external URL icon does not show up.
*/
to: versionUrl,
/**
* Just like the version docs in this project,
* we want to archived versions to open in the
* same tab.
*/
target: '_self',
})),
{ to: 'https://ionicframework.com/docs/v4/components', label: 'v4', target: '_blank' },
{ to: 'https://ionicframework.com/docs/v3/', label: 'v3', target: '_blank' },
],
// dropdownItemsAfter: [{to: '/versions', label: 'All versions'}],
dropdownActiveClassDisabled: true,
},
{
Expand Down Expand Up @@ -323,8 +265,6 @@ module.exports = {
},
prism: {
theme: { plain: {}, styles: [] },
// Prism provides a [default list of languages](https://github.com/FormidableLabs/prism-react-renderer/blob/e1c83a468b05df7f452b3ad7e4ae5ab874574d4e/packages/generate-prism-languages/index.ts#L9-L26).
// A list of [additional languages](https://prismjs.com/#supported-languages) that are supported can be found at their website.
additionalLanguages: ['shell-session', 'http', 'diff'],
},
algolia: {
Expand All @@ -335,7 +275,6 @@ module.exports = {
},
},
plugins: [
// Allows usage of Sass/SCSS in the CSS preprocessor.
'docusaurus-plugin-sass',
[
'docusaurus-plugin-module-alias',
Expand All @@ -354,10 +293,7 @@ module.exports = {
async loadContent() {
const repoName = 'ionicframeworkcom';
const endpoint = prismic.getEndpoint(repoName);
const client = prismic.createClient(endpoint, {
fetch,
});

const client = prismic.createClient(endpoint);
return await client.getByType('docs_ad');
},
async contentLoaded({ content, actions: { setGlobalData, addRoute } }) {
Expand Down
17 changes: 17 additions & 0 deletions i18n/ja/docusaurus-plugin-content-docs/current/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
# Docs folder

The `/docs` folder houses all markdown files. The page structure loosely maps to the routing on the site since paths can be changed in the frontmatter.

## Versioning

This folder can also contain components, assets, and whatever else is meant to be versioned when the docusaurus versioning script is run. For example, if there is a page component that is only relevant to the `layout` section in the current version of Ionic, it could be added to a `_components/` folder in `docs/layout/`. When the versioning script is run, the component will be copied to `versioned_docs/version-{X}/layout/_components/` and there will now be a separate component in `docs/layout/_components/` that can be deleted or updated to the latest version. The same concept applies to images and other files.

If components are meant to be shared across versions, they can be put in `src/components/`. If images and other served files are meant to be shared across versions they can be put in `static/`.

## Auto Generated Files

All markdown files in these directories are generated from [scripts](/scripts):

- `docs/api/`
- `docs/cli/commands/`
- `docs/native/`
Loading
Loading