Is there a way to exclude paths within docs directory in docusaurus? - docusaurus

I want to exclude a subfolder from the docs/ directory from generating doc pages. customDocsPath is a related option but it's a string. Is there by any chance some undocumented option that accepts something like a glob pattern?

I was able to exclude it by specifying the configuration of the #docusaurus/preset-classic (#docusaurus/plugin-content-docs) plugin.
https://docusaurus.io/docs/api/plugins/#docusaurus/plugin-content-docs
presets: [
[
'#docusaurus/preset-classic',
{
docs: {
exclude: ['**/any/dir/**'],
},
},
],
],
I tested it with v2beta.9.

To formally answer your question, no there isn't an option to do so in Docusaurus V1.
It's unlikely that we will add this into V1 but we would be happy to support that functionality in V2 and add a draft option in the front matter so that it would show up during development but not the production build.

Related

How to configure VS Code to understand nested package.jsons?

I have a large React Native application which uses nested package.json files to keep the dependency imports at the top of the package clean.
For example, my libraries folder has a package.json containing the following:
{
"name": "libraries",
"version": "0.0.1"
}
This means I can import a tool like so:
import { toSnakeCase } from 'libraries/string/transform';
the alternative would be
import { toSnakeCase } from '../../../libraries/string/transform';
This makes the code much simpler to write and reason.
VSCode out of the box does not know how to handle these imports, so a lot of the functionality is missing.
Does anyone know how to correct this?
Thanks
I've found the answer!
Assuming you're working with Typescript you should have a tsconfig.json in your project root.
You need to add the following keys to tsconfig.json.
"compilerOptions": {
"baseUrl": "./src",
"paths": {
"constants": ["constants/*"],
"forms": ["forms/*"],
"libraries": ["libraries/*"]
}
}
baseUrl is essentially the root of your source code.
paths is an object detailing where to map the keys to.
Source: https://netbasal.com/sexier-imports-in-typescript-e3c645bdd3c6
You can use something like lerna, which can manage multiple packages together in one folder.
Your repo will become like this, according to the docs:
my-lerna-repo/
package.json
packages/
package-1/
package.json
package-2/
package.json

Does Docusaurus support renaming the 'docs' output folder?

I am currently evaluating using Docusaurus to generate a static web site. The site itself is not documentation focused, in fact, the site is not even computer or technology related. But as a techie myself, I want a CI and Git-powered publishing strategy for this web site.
Docusaurus uses Markdown for its page content (outside of custom React-based pages). However, when these Markdown pages are built, they are all placed in a top-level folder in the static site called docs. This folder naming doesn't really fit with the web site I want to produce.
There is a configuration setting for customDocsPath but this only changes where the build looks for Markdown files, not the output path in the created site content.
I'm not a React developer, but aside from hacking away at the JavaScript in the build engine to search/replace instances of docs, is there a better way to do this?
In docusaurus 2 changing main docs folder is quite straightforward:
rename docs/ to whatever/
add following to docusaurus.config.js
presets: [
[
'#docusaurus/preset-classic', // should be already there
{
docs: {
path: 'whatever',
routeBasePath: 'whatever',
// ...
We don't currently support routes other than /docs - yet. There is a pull request that started back in August, but has been recently resurrected again. The PR is being reviewed and updated to allow more customizable routes.
As of Docusaurus 1.6, this is now implemented. The pull request has been merged.
More details about this are found in the site configuration.
Simply add the following to the siteConfig section in siteConfig.js:
const siteConfig = {
title: 'My Awesome Site',
docsUrl: '',
// ...
};

How to include specific node_modules to load into webpack?

I'm using react-native-web and I've come across a couple of projects that do not compile their babel code (react-native-popover and react-native-vector-icons). So I need to compile these node_modules. I know the babel-preset-react-native preset exists. Is there any way I can use the babel loader I currently have (see below) and also include another loader for the above mentioned packages? Ideally any node_module that is prefaced with react-native would be loaded using babel-preset-react-native.
{
test: /\.js$/,
exclude: /node_modules/,
loaders: [
'react-hot',
'babel-loader?cacheDirectory=true'
]
},
Exclude takes a regular expression. You can use something like this to get your desired effect.
exclude: /node_modules\/(?!react-native)/

How to deliver an aurelia library for consumption by aurelia CLI based app

I'm building a library of aurelia custom elements for use by several different aurelia apps and am running into trouble getting the custom element html hooked into the app bundle properly with the CLI process.
I'm currently thinking that the library will be part of package.json and thus listed under node_modules/my-lib. What should the delivered .html format be
<template>...</template>
or should it be delivered in required format
define('text!my-lib/component1.html', ['module'], function(module) { module.exports = "<template>\r\n ...
If the former - what do I put in aurelia.json to get it to be included correctly in the vendor-bundle?
If I do resouces['../node_modules/my-lib/**/*.html'] in my-lib dependency section - it gets included as html in a js file which throws an error.
If I add as source to the vendor-bundle or using my own bundle my-lib-bundle.js
"source": [
"[../node_modules/my-lib/**/*.js]",
"../node_modules/my-lib/**/*.{css,html}"
],
Nothing gets included then except the 'main' listed in the one dependency.
If I add to the markupProcess (which seems more linked to the app and not a library)
"markupProcessor": {
"id": "none",
"displayName": "None",
"fileExtension": ".html",
"source": [
"src\\**\\*.html",
"..\\node_modules\\my-lib\\**\\*.html"
]
},
I get the html correctly added to app-bundle but has the wrong path because it includes the '../node_modules' in the define so it's not found when the app attempt to use it.
I'm not using the CLI to build my lib as I want the app to only include pieces it uses. So the JS is built and delivered in AMD format, but I wasn't sure the process to go through with HTML?
Suggestions?
There is a skeleton plugin repo # github
https://github.com/aurelia/skeleton-plugin
With build scripts and all

How do I include a javascript library for reference in spine.js

I have an old javascript library with methods I need to use from within my spine app. How do I include it for use within spine?
You need to include the library in your slug.json in the "libs" section like so:
{
"dependencies": [
"jqueryify",
...
],
libs: [
"path/to/old/javascript/file.js"
]
}
This will tell Hem to package files under "lib" first in your application.js. You should have access to the methods in your Spine classes. Make sure you include the extension (".js") on libs and path them relative to the root of your app. You can see the Hem docs for more info.
Depends on your pipeline for assets and your platform. If just the old library to a page, use a script tag:
<script type="text/javascript" src="my_old_library.js"></script>
This is likely the same way you included spine.js on your page.