日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間：8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
用ScriptKit來優(yōu)化日常工作流

我們的日常工作中，往往充斥著各種瑣碎的任務(wù)：打開項目，搜索信息，查文檔等。這些任務(wù)不斷的侵蝕著我們的專注力，降低我們的工作效率。

創(chuàng)新互聯(lián)公司堅持“要么做到，要么別承諾”的工作理念，服務(wù)領(lǐng)域包括：網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計、企業(yè)官網(wǎng)、英文網(wǎng)站、手機端網(wǎng)站、網(wǎng)站推廣等服務(wù)，滿足客戶于互聯(lián)網(wǎng)時代的鄂爾多斯網(wǎng)站設(shè)計、移動媒體設(shè)計的需求，幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴！

Script Kit[1] 是一個功能強大，易用的啟動器(啟動器如 Mac 上的 Alfred)。它可以幫助我們快速的完成這些瑣碎任務(wù)。

本文來做一個 Demo，實現(xiàn)如下幾種任務(wù)：

  1. 文本搜索。
  2. 打開網(wǎng)站。
  3. 用搜索引擎搜索信息。
  4. 打開項目。
  5. 查看代碼參考。

下面，我們來 Building 吧~

第 1 步 安裝 Script Kit

在 官網(wǎng)[2] 下載安裝包安裝。

打開 Script Kit 后，Script Kit 處于最小化狀態(tài)。展開 Script Kit 有兩種方式:

  1. 快捷鍵command + ;。
  2. 點擊頭部狀態(tài)欄中的圖標。

第 2 步 創(chuàng)建腳本

進入 Script Kit 輸入腳本的名字，然后回車，就完成了腳本的創(chuàng)建。我們這邊的 Demo 的名字叫 nav。

Script Kit 創(chuàng)建了如下的腳本文件 nav.js

// Name: nav

import "@johnlindquist/kit"

其中:

  1. // Name: nav: 該腳本的名稱。
  2. import "@johnlindquist/kit": 引入基礎(chǔ)庫。這是必須的。

第 3 步 運行腳本

在上面的腳本中添加內(nèi)容，div('Hello World!'):

// Name: nav

import "@johnlindquist/kit"

div('Hello World!')

展開 Script Kit(command + ;), 輸入 nav:

按回車運行，會出現(xiàn)如下的結(jié)果:

第 4 步 制作列表

實現(xiàn)代碼如下：

const selected = await arg('請選擇', [
  // 文本
  {
    name: '快速創(chuàng)建 React 項目的命令',
    description: '用 cra 創(chuàng)建',
    tag: '文本',
    value: {
      type: 'text',
      content: 'npx create-react-app 項目名稱',
    }
  },
  // 鏈接
  {
    name: 'Vue3 文檔',
    description: 'Vue3 的官方文檔地址',
    tag: '鏈接',
    value: {
      type: 'url',
      content: 'https://cn.vuejs.org/guide/introduction.html'
    }
  },
  // 搜索引擎
  {
    name: '必應(yīng)',
    description: '用必應(yīng)搜索信息',
    tag: '搜索引擎',
    value: {
      type: 'search-engine',
      content: 'https://cn.bing.com/search?q={q}'
    }
  },
  // 項目
  {
    name: 'JoJo 石之海 官網(wǎng)項目',
    description: '用 VSCode 打開該項目',
    tag: '項目',
    value: {
      type: 'project',
      content: home('project/jojo/website')
    }
  },
  // 代碼參考
  {
    name: 'React 相關(guān) ts 類型寫法',
    tag: '代碼參考',
    preview:  async () => {
      const code = await highlightCode({
        contents: codeContent, 
        language: 'javascript'
      })
      return code
    },
    value: {
      type: 'search-engine',
      content: 'https://cn.bing.com/search?q={q}'
    }
  },
])

列表中的每個選項對應(yīng)上面數(shù)組中一個 item。內(nèi)容和代碼的對應(yīng)關(guān)系如下：

value 是用戶選擇后，程序接收到的值。用 type 來標識不同的 item 類型。后面會根據(jù)不同的 type，做不同的處理。

item 中的 preview 是設(shè)置選中時的預覽內(nèi)容。如下圖所示：

上圖中的代碼預覽用的第三方包：highlight.js。實現(xiàn)代碼如下：

const wrapCode = (html) => `


  
${html.trim()}
  
`;

const highlightCode = async ({ contents, language }) => {
  const { default: highlight } = await npm("highlight.js");
  let highlightedContents = language
    ? highlight.highlight(contents, { language }).value
    : highlight.highlightAuto(contents).value;

  return wrapCode(highlightedContents);
};

可以看到，在腳本中使用 npm 包只要這么寫：await npm("包名")。

第 5 步 選擇后的處理

對選擇不同類型的內(nèi)容，做不同的處理：

  • 選中文本：將文本復制到粘貼板。
  • 選中鏈接：在瀏覽器中打開鏈接。
  • 選中搜索引擎：輸入關(guān)鍵字，用搜索引擎搜索。
  • 選中項目：在 VSCode 中打開項目。

代碼如下：

const {
  content,
  type,
} = selected

switch(type) {
  // 文本
  case 'text':
    copy(content) // 將文本復制到粘貼板。
    break
  // 鏈接
  case 'url':
    browse(content) // 用瀏覽器打開。
    break
  // 搜索引擎
  case 'search-engine':
    const query = await arg('關(guān)鍵字:')
    const url = content.replace('{q}', encodeURIComponent(query))
    browse(url)
    break
  // 項目
  case 'project':
    exec(`code ${content}`) // 用 VSCode  打開。
    break
}

上面的 copy, browse, exec 是 Script Kit 內(nèi)置的功能。Script Kit 內(nèi)置了茫茫多的功能。

第 6 步 細節(jié)優(yōu)化

自定義腳本名稱并加上描述信息

代碼如下:

// Name: 導航
// Description:

效果如下：

設(shè)置啟動該腳本的快捷鍵

// Shortcut: cmd shift 0

按住 cmd + shift + 0，可以直接運行腳本。

加交互反饋

文本內(nèi)容復制到粘貼板，加交互提示：

copy(content) // 將文本復制到粘貼板。
new applescript(`display alert "內(nèi)容已拷貝到粘貼板"`)

完整代碼: 這里[3]

其他功能

本文介紹的只是 Script Kit 功能的冰山一角。

可以通過 AppleScript[4] 和 本地應(yīng)用交互。比如，如下腳本實現(xiàn)了關(guān)閉所有的 Finder 窗口：

new applescript(`
tell application "Finder"
 set theWindowList to windows
 repeat with i from 1 to number of items in theWindowList
  set this_item to item i of theWindowList
  set windowName to name of this_item
  close this_item
 end repeat
end tell
`)

調(diào)接口來查詢網(wǎng)上的信息，生成摘要并顯示。比如，查詢圖書信息信息

let query = await arg('Search for a book title:')

//This API can be a little slow. Wait a couple seconds
let response = await get(`http://openlibrary.org/search.json?q=${query}`)

let transform = ({title, author_name}) =>
  `* "${title}" - ${author_name?.length && author_name[0]}`

let markdown = response.data.docs.map(transform).join('\n')

inspect(markdown, 'md')

用定時任務(wù)來做定時需要做的事。每天間隔2個小時提醒喝水。

常見問題

如何調(diào)試?

inspect(內(nèi)容)

支持哪些全局對象？

常用的：

// 展示內(nèi)容
div // 渲染 html 內(nèi)容
md: Markdown // 渲染 markdown 內(nèi)容
terminal: (script: string) => Promise // 打開命令行，并執(zhí)行腳本

// 接口調(diào)用。用的是 Axios。
get: AxiosInstance["get"]
put: AxiosInstance["put"]
post: AxiosInstance["post"]
patch: AxiosInstance["patch"]

// 文件操作
readFile: typeof fsPromises.readFile
writeFile: typeof fsPromises.writeFile
appendFile: typeof fsPromises.appendFile
createWriteStream: typeof fs.createWriteStream
readdir: typeof fsPromises.readdir
cd: typeof shelljs.cd
cp: typeof shelljs.cp
chmod: typeof shelljs.chmod
ls: typeof shelljs.ls
mkdir: typeof shelljs.mkdir
mv: typeof shelljs.mv

// 存取數(shù)據(jù)
db:

所有的見這里[5]。

參考資料

[1]Script Kit: https://www.scriptkit.com/

[2]官網(wǎng): https://www.scriptkit.com/

[3]這里: https://github.com/iamjoel/rocket/blob/main/code/glue/script-kit/intro/nav.js

[4]AppleScript: https://developer.apple.com/library/archive/documentation/AppleScript/Conceptual/AppleScriptLangGuide/introduction/ASLR_intro.html

[5]這里: https://github.com/johnlindquist/kit/discussions/187


網(wǎng)站名稱：用ScriptKit來優(yōu)化日常工作流
鏈接URL：http://www.5511xx.com/article/dhjehod.html