A collection of utility functions we use with vuecid-nuxt
Get started:
$ nvm use
$ yarnTo generate the dist folder:
$ yarn buildTo generate the docs:
# Install documentation.js globally
$ yarn global add documentation
# Generate docs
$ yarn docs- cleanString
- decodeHtmlEntity
- applyToOneOrMany
- generateLocalizedRoutes
- generateRoutesFromData
- checkAndGetHomeSlug
- isHomeSlug
- isHome
- cleanSlug
- getPathFromUrl
- removeHomeSlug
- removeLeadingLang
- removeLeadingSlash
- removeTrailingSlash
- verifyLeadingSlash
- verifyTrailingSlash
Clean a string: deburr, lowercase and kebabcase it. This is good to generate ids.
strstring A dirty string
cleanString('Some sting äöü')
// -> 'some-sting-aou'Returns string A clean string
Decode unicode characters (decode html text into html entity).
Inspired by this gist: https://gist.github.com/CatTail/4174511
strstring An encoded string
Returns String A decoded string
Apply a function to a single object or to every item in an array.
Returns Array Your data array with the funtion applied
Generate localized routes using Nuxt's generated routes and i18n config
optionsObject The options object to pass in (optional, default{baseRoutes:[],defaultLang:'',langs:[],routeAliases:{},isChild:false})
Returns Array Localized routes to be used in Nuxt config
Generate routes from data
Uses a .json file as base to generate route to this post or page.
Special behaviour for home slugs:
We use / for the default lang home slug, /en/ for the english home etc.
/pages/something/home-sweet-home
In the generateRoutesFromData process we remove all pages which include home.
🤷 Makes sense to be aware of that!
optionsObject The options object to pass in (optional, default{langs:[],postTypes:{},dataPath:'',bundle:'',homeSlug:'home',errorPrefix:'error-'})
generateRoutesFromData({
langs: config.env.LANGS,
postTypes: config.postTypes,
dataPath: '../../../../../static/data',
bundle: 'basic',
homeSlug: config.env.HOMESLUG,
errorPrefix: config.env.ERROR_PREFIX
})Returns Array An array of routes to be generated by nuxt generate
Returns homeSlug if we are on home, e.g. '/en/' or '/en' or '/'
Returns string homeSlug or path
Test if slug is homeSlug ('home').
Returns Boolean
Returns true if we are on home, e.g. '/en/' or '/en' or '/'
Returns Boolean
Get the naked slug without any slashes or locales.
strstring
cleanSlug('en/myslug/')
// -> 'myslug'Returns string
Regex to get the path from url. Makes sure that there is a leading slash. https://regex101.com/r/uMOB5V/2/
strstring
getPathFromUrl('https://www.mysite.com/en/myslug/')
// -> '/en/myslug/'Returns string
Remove 'home' from url.
removeHomeSlug('https://www.mysite.com/home/')
// -> 'https://www.mysite.com/'Returns string
Remove leading language locale.
strstring
removeLeadingLang('en/myslug/')
// -> 'myslug/'Returns string
Remove leading slash.
strstring
removeLeadingSlash('/myslug/')
// -> 'myslug/'Returns string
Remove trailing slash.
strstring
removeTrailingSlash('/myslug/')
// -> '/myslug'Returns string
Verify leading slash.
strstring
verifyLeadingSlash('myslug')
// -> '/myslug'Returns string
Verify leading slash.
strstring
verifyTrailingSlash('myslug')
// -> 'myslug/'Returns string
- isWordPressPreview
- flattenACF
- normalizeWordpress
- applyToOneOrMany
- removeFieldsFromPost
- decodeTitle
- decodeHtmlEntity
- reduceBundle
- generateMetaInfo
- removeTrailingSlash
- removeLeadingSlash
- verifyTrailingSlash
- generateHreflangs
- removeHomeSlug
- generateMetaImageInfo
Check if we are in preview mode by looking for query strings. If we have all three it's a pretty fair indicator we are in preview mode.
Returns Boolean Do I look like a preview?
Flatten acf in WordPress post object(s).
data
Normalize WordPress post object(s).
data
Apply a function to a single object or to every item in an array.
Returns Array Your data array with the funtion applied
Delete fields we don't need (anymore).
data
Data transformation to decode any unicode characters in the title property.
data
Decode unicode characters (decode html text into html entity).
Inspired by this gist: https://gist.github.com/CatTail/4174511
strstring An encoded string
Returns String A decoded string
Create reduced WordPress post object(s). This is good to generate routes or sitemaps.
data
Generate meta info.
hid in meta tags is needed to prevent duplicate properties https://nuxtjs.org/faq/duplicated-meta-tags/ also they have to override nuxt.configs manifest infos, which sets an hid therefore the og:description hid has to be called 'hid: "og:description"' and so on
$0Object (optional, default{})$0.siteSettings(optional, default{})$0.post(optional, default{})$0.path(optional, default'')$0.locale(optional, default'')$0.debug(optional, defaultfalse)$0.titlePattern(optional, defaulttrue)$0.titlePatternSeparator(optional, default' | ')
Remove trailing slash.
strstring
removeTrailingSlash('/myslug/')
// -> '/myslug'Returns string
Remove leading slash.
strstring
removeLeadingSlash('/myslug/')
// -> 'myslug/'Returns string
Verify leading slash.
strstring
verifyTrailingSlash('myslug')
// -> 'myslug/'Returns string
Generates hreflangs for all translations of a post.
More about the hreflang attribute.
Returns Array
Remove 'home' from url.
removeHomeSlug('https://www.mysite.com/home/')
// -> 'https://www.mysite.com/'Returns string
Generates meta image info
Like the meta description the OG Image is generated from the page-wide options, but will use a more specific OG image on a page/post – if set.
It uses the predefined size (social-share-large), which we defined in our WordPress image crops. 1280px x 720px.
By defining those sizes, an image does not have to be inspected by a platform like facebook, because it does not know the size yet. This saves time.
$0Object (optional, default{})$0.siteSettings(optional, default{})$0.post(optional, default{})
siteSettingsObjectpostObject
Returns Array