feat(core): allow sourcing from multiple static directories

[oriooctopus]

This is a WIP

[netlify]

[V1] Deploy preview failure

Built without sensitive environment variables with commit b4423b0

https://app.netlify.com/sites/docusaurus-1/deploys/600d08435d5ff20009fbd5ed

[github-actions]

Size Change: 0 B

Total Size: 28.8 kB

ℹ️ View Unchanged

Filename	Size	Change
website/build/blog/2017/12/14/introducing-docusaurus/index.html	21.7 kB	0 B
website/build/docs/introduction/index.html	180 B	0 B
website/build/index.html	6.88 kB	0 B

_{compressed-size-action}

[netlify]

✔️ [V2]
Built without sensitive environment variables

🔨 Explore the source changes: 4901a12

🔍 Inspect the deploy log: https://app.netlify.com/sites/docusaurus-2/deploys/6196526d6bc8d9000782b008

😎 Browse the preview: https://deploy-preview-4095--docusaurus-2.netlify.app

[github-actions]

⚡️ Lighthouse report for the changes in this PR:

Category	Score
🟢 Performance	92
🟢 Accessibility	98
🟢 Best practices	100
🟢 SEO	100
🟢 PWA	95

Lighthouse ran on https://deploy-preview-4095--docusaurus-2.netlify.app/

[slorber]

Thanks for working on this!

What I suggest:

• use default() in config validation
• get rid of the STATIC_DIR_NAME constant, to ensure the configured array is used everywhere
• support the static dir array in the mdx loader

[slorber]

That looks nice 👍

We should support static dir array in mdx loader too

As you are on it, one idea I had is to have a i18n/<locale>/static folder as a convention for localized assets, as we don't have a good way to localize static assets currently

[slorber]

oh, hopefully they allow an array here 😅

[Josh-Cena]

Yeah, they do:
https://webpack.js.org/configuration/dev-server/#directory
https://webpack.js.org/plugins/copy-webpack-plugin/#root

The one thing I'm slightly worried about though is path collisions. I don't know if any warning should be given in that case

[Josh-Cena]

We should support static dir array in mdx loader too

Yes, realized that

one idea I had is to have a i18n/<locale>/static folder as a convention for localized assets

I'd always used /static/zh-Hans/img/ instead, which also works great with URL mapping. But seems i18n/zh-Hans/static works better with Crowdin🤔

One thing I didn't particularly like about the MDX loader is it converts static paths to require calls. Before I delve into the internals, as a user, I always thought that I was referencing a URL path with /img/docusaurus.png instead of a file path ㄟ(▔,▔)ㄏ

[slorber]

I'd always used /static/zh-Hans/img/ instead, which also works great with URL mapping. But seems i18n/zh-Hans/static works better with Crowdin🤔

Oh yes didn't think about that 😅 this is probably enough for now. Assets may not need to be uploaded to Crowdin. We'll see if someone ask for this extra i18n static path

One thing I didn't particularly like about the MDX loader is it converts static paths to require calls.

This is important so that assets enter the Webpack pipeline instead of just being referenced strings.

This leads to assets being hashed, providing better long-term caching.

And also we might have a better image infra someday, allowing you to use ideal image on markdown files with simple md syntax. Some image-heavy docs have annoying image-related layout shifts atm (can probably be solved with width/height in the short term anyway)

[Josh-Cena]

@slorber I'm done 👍 Things are working very well and we also get to separate the dogfooding assets from the actual assets the site is using. Also separated Markdown assets fully from static assets documentation—after this is merged we can close #3198 as well

[slorber]

That looks great, and it's nice to have moved the dogfood assets!

Just minor changes:

• Support absolute path? I can see some users that may want to do that (those using home-made deployment on their own corporate servers in particular)
• Tests should rather cover arrays with multiple static dirs