facebook twitter hatena line email

「Javascript/vue/vuepress」の版間の差分

提供: 初心者エンジニアの簡易メモ
移動: 案内検索
(結果数)
(検索結果件数)
(同じ利用者による、間の8版が非表示)
行45: 行45:
  
 
algoliaとはSaaSの全文検索エンジンサービスで広告を表示すれば無料で使える。
 
algoliaとはSaaSの全文検索エンジンサービスで広告を表示すれば無料で使える。
無料で24時間毎にクロールしてくれる。
+
 
 +
自身のサイトがドキュメントサイトで、Algoliaコミュニティに登録すれば、無料で24時間毎にクロールしてくれる。
  
 
Algolia DocSearch申請
 
Algolia DocSearch申請
行54: 行55:
 
  https://github.com/algolia/docsearch-configs/blob/master/configs/hogehoge.json
 
  https://github.com/algolia/docsearch-configs/blob/master/configs/hogehoge.json
  
 +
regionはeuropeに強制でなる模様。
  
 
参考:https://kitigai.hatenablog.com/entry/2019/04/04/133432
 
参考:https://kitigai.hatenablog.com/entry/2019/04/04/133432
行76: 行78:
 
   apiKey: '<API_KEY>',
 
   apiKey: '<API_KEY>',
 
   appId: '<API_ID>',
 
   appId: '<API_ID>',
   indexName: '<INDEX_NAME>'
+
   indexName: '<INDEX_NAME>',
 
   algoliaOptions: {
 
   algoliaOptions: {
 
     hitsPerPage: 10,
 
     hitsPerPage: 10,
行82: 行84:
 
  }
 
  }
 
hitsPerPageを10にすると10件に増える。(デフォは5件)
 
hitsPerPageを10にすると10件に増える。(デフォは5件)
 +
 +
apiKeyはanalyticsのapikeyじゃなくて、初回メールきたapiKeyを使う。後日管理画面には記載されないっぽい。(管理画面にはanalyticsのapiKeyしかない)
  
 
参考:https://stackoverflow.com/questions/52019383/vuepress-algolia-increase-results
 
参考:https://stackoverflow.com/questions/52019383/vuepress-algolia-increase-results
 +
 +
===15日試用期間===
 +
- 最大5,000,000レコード
 +
- 最大2500万オペレーション
 +
- 無制限の同義語
 +
- 最大10,000のクエリルール
 +
- 開発チームによるサポート
 +
 +
===COMMUNITYプラン(無料版)の制約===
 +
1秒あたりのクエリ 30query/sec
 +
1レコードの最大サイズ 10KB
 +
最大レコード数 1万レコード
 +
最大オペレーション数 10万オペレーション/month
 +
 +
https://qiita.com/mido_app/items/919839aaf33382d9bc89
 +
 +
===algoliaで同一サイトでアカウントを別にしたいとき===
 +
旧アカウントに紐付いてたcacheを削除して、問い合わせして
 +
新しいアカウント側でリンクを踏んで(https://www.algolia.com/users/sign_in)dosearchのcacheができてた。
  
 
==参考==
 
==参考==
 
https://qiita.com/dojineko/items/aae7e6d13479e08d49fd
 
https://qiita.com/dojineko/items/aae7e6d13479e08d49fd

2019年7月24日 (水) 14:23時点における版

vuepressとは

Markdownのドキュメントジェネレーター

サイトデザインなど変更

設定ファイル

.vuepress/config.js

カスタム変数用意

.vuepress/scripts/string.js

const string = {
    example: {
        mail: "hoge@example.com"
    }
}
export default {
    computed: {
        $string () {
            return string
        }
    }
}

.vuepress/enhanceApp.js

import strings from "./scripts/string"
export default ({
      Vue,
      options,
      router,
      siteData
}) => {
      Vue.mixin(strings);
}


example1.md

ver:{{$string.example.mail}}'

全文検索API

Algoliaが使える。https://www.algolia.com/users/sign_in

algoliaとはSaaSの全文検索エンジンサービスで広告を表示すれば無料で使える。

自身のサイトがドキュメントサイトで、Algoliaコミュニティに登録すれば、無料で24時間毎にクロールしてくれる。

Algolia DocSearch申請

https://community.algolia.com/docsearch/#join-docsearch-program

こんな感じの結果が1日で来る

apiKey: 'bb637hogehogegehohogehogegehohogehogegehoge',
indexName: 'gehogehoge',
https://github.com/algolia/docsearch-configs/blob/master/configs/hogehoge.json

regionはeuropeに強制でなる模様。

参考:https://kitigai.hatenablog.com/entry/2019/04/04/133432

やり方

.vuepress/config.js

module.exports = {
  themeConfig: {
    algolia: {
      apiKey: '<API_KEY>',
      indexName: '<INDEX_NAME>'
    }
  }
}
  1. 既にmodule.exports/themeConfig構成がある場合は、そこに混ぜないと、上書きしてしまうので注意。
  2. しばらくすると検索に全文検索結果が出てくるはず。

検索結果件数

algolia: {
  apiKey: '<API_KEY>',
  appId: '<API_ID>',
  indexName: '<INDEX_NAME>',
  algoliaOptions: {
    hitsPerPage: 10,
  },
}

hitsPerPageを10にすると10件に増える。(デフォは5件)

apiKeyはanalyticsのapikeyじゃなくて、初回メールきたapiKeyを使う。後日管理画面には記載されないっぽい。(管理画面にはanalyticsのapiKeyしかない)

参考:https://stackoverflow.com/questions/52019383/vuepress-algolia-increase-results

15日試用期間

- 最大5,000,000レコード
- 最大2500万オペレーション
- 無制限の同義語
- 最大10,000のクエリルール
- 開発チームによるサポート

COMMUNITYプラン(無料版)の制約

1秒あたりのクエリ 	30query/sec
1レコードの最大サイズ 	10KB
最大レコード数 	1万レコード
最大オペレーション数 	10万オペレーション/month

https://qiita.com/mido_app/items/919839aaf33382d9bc89

algoliaで同一サイトでアカウントを別にしたいとき

旧アカウントに紐付いてたcacheを削除して、問い合わせして 新しいアカウント側でリンクを踏んで(https://www.algolia.com/users/sign_in)dosearchのcacheができてた。

参考

https://qiita.com/dojineko/items/aae7e6d13479e08d49fd