enhancing DocSearch integration with language

[s-pace]

Summary
We want to introduce the new way DocSearch will handle search on different languages for vuepress.

It will not more be needed to use the URL as it might introduce issue. We will grab it ourselves from the DOM (attribute lang).

You can now update the vuepress website (couldn't find the website's repo):

<!-- at the end of the HEAD -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.css" />

<!-- at the end of the BODY -->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/docsearch.js@2/dist/cdn/docsearch.min.js"></script>
<script type="text/javascript"> docsearch({
  apiKey: '3a539aab83105f01761a137c61004d85',
  indexName: 'vuepress',
  inputSelector: '### REPLACE ME ####',
  algoliaOptions: { 'facetFilters': ["lang:$LANG"] },
  debug: false // Set debug to true if you want to inspect the dropdown
});
</script>

• Add a search input in your page if you don't have any yet. Then update the inputSelector value in JS snippet to a CSS selector that targets your search input field.

• Replace $LANG with the lang you want to search on.
  So as of today you have: en-US, zh-CN

What kind of change does this PR introduce? (check at least one)

• Feature
• Docs

We do update the Documentation's references.

Does this PR introduce a breaking change? (check one)

• No

CC #686

[ulivz]

Thanks for your great work.

---

Q: Why can't you find the website's repo?
A: Because VuePress is built by Netlify.

[s-pace]

thanks @ulivz

How can we help you to integrate back the DocSearch JS snippet within the documentation website then?

[s-pace]

You can discard my last comment. Solved by #686 (comment)