Comments (6)
To augment this (very helpful thread), I found a snippet of code that will make the flexsearch support both Latin alphabet (English) and CJK (Chinese) in the same search box:
alex-shpak/hugo-book#80 (comment)
Just apply it both in gridsome.config.js as well as in the search component in place of return str.replace(/[\x00-\x7F]/g, "").split("")
from gridsome-plugin-flexsearch.
@chenhongen I should think this is more a flexsearch issue - have you tried checking out their docs?
https://github.com/nextapps-de/flexsearch#add-language-specific-stemmer-andor-filter
from gridsome-plugin-flexsearch.
I find a issue in flexsearch about,and change my config to :
{
use: 'gridsome-plugin-flexsearch',
options: {
collections: [
{
typeName: 'ChePost',
indexName: 'ChePost',
fields: ['title', 'content', 'description']
}
],
searchFields: ['title', 'content', 'description'],
flexsearch: {
encode: false,
tokenize: function(str){
return str.replace(/[\x00-\x7F]/g, "").split("");
}
}
}
},
But,It doesn't work in neither Chinese nor English.It's a correct way to specify optional flexsearch configurations under a flexsearch key like this?
from gridsome-plugin-flexsearch.
@chenhongen Sorry for the delay on this, haven't had much spare time recently.
However, I think I know what the issue is here. The flexsearch options are passed to the client as JSON- so you obviously can't pass a function in that object.
I'm currently looking into a solution for this.
from gridsome-plugin-flexsearch.
@chenhongen I have just added support for a custom tokenize/encoder function, but it requires a bit of manual setup. Would you be able to test the below, and let me know if it works?
Install v0.1.17
Add this configuration in gridsome.config.js
{
use: 'gridsome-plugin-flexsearch',
options: {
autoSetup: false
collections: [
{
typeName: 'ChePost',
indexName: 'ChePost',
fields: ['title', 'content', 'description']
}
],
searchFields: ['title', 'content', 'description'],
flexsearch: {
encode: false,
tokenize: function(str){
return str.replace(/[\x00-\x7F]/g, "").split("");
}
}
}
},
Then in your header/nav/search component, manually setup the flexsearch instance:
<script>
import FlexSearch from 'flexsearch'
export default {
data: () => ({
searchTerm: '',
search: null
}),
computed: {
searchResults () {
const searchTerm = this.searchTerm
if (searchTerm.length < 3) return []
const results = this.search.search({ query: searchTerm, limit: 5, suggest: true })
console.log(results)
return results
}
},
async mounted () {
// Some flexsearch options, and helper functions
const { flexsearch, loadIndex } = this.$flexsearch
// Create a flexsearch instance, and load our config options, plus our custom tokenizer function
const search = new FlexSearch({
...flexsearch,
tokenize: function (str) {
return str.replace(/[\x00-\x7F]/g, '').split('')
}
})
// Make search available on this
this.search = search
// Load our index data into flexsearch
await loadIndex(search)
}
}
</script>
from gridsome-plugin-flexsearch.
Good job! Follow your steps,It works well~ thx
from gridsome-plugin-flexsearch.
Related Issues (20)
- TypeError: Object.fromEntries is not a function - after upgrading to gridsome v0.7.17 HOT 5
- Error when manually fetching flexsearch.json after upgrading to version 1.0.1 HOT 2
- Image src is wrong HOT 7
- Getting Object.fromEntries is not a function when deploying in Netlify HOT 4
- Problem configuring FlexSearch HOT 2
- Field date HOT 2
- Tags object HOT 2
- Not work with Cyrillic HOT 1
- Deal with custom field resolvers HOT 1
- Is there a way to search by a nested object value? HOT 4
- Only certain fields are successfully added to the Flexsearch Index, despite configuration HOT 2
- Results effected by searchFields order HOT 6
- Causes UnhandledPromiseRejectionWarning in @gridsome\source-filesystem HOT 3
- Using Gridsome-graphql-source with flexsearch not workin HOT 2
- How to make it work with Contentful Source HOT 2
- Asking for a little help setting up with a section built with strapi HOT 1
- v2 Causes undefined Error HOT 7
- Cannot read property 'map' of undefined HOT 15
- Support callback function or regex in autoFetch HOT 2
- Not working with gridsome upgrade to 0.7.23 HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from gridsome-plugin-flexsearch.