pluto-frontend

小助教

大綱

• pluto-frontend
  • 大綱
  • 環境需求
  • 本機開發
    • 安裝
    • 開發
    • 打包
    • 執行預覽 (打包後)
  • 部署更新時間
  • VSCode
  • Type Support for .vue Imports in TS
  • 開發分之說明

環境需求

• nodejs 18.14.2
• vuetify 3.3.3

本機開發

安裝

npm install

開發

為了串接 OAuth，在本地開發時必須也要使用 https 才能夠將 cookies 傳送到 OAuth 測試機，參考 schemeful-samesite

npm run dev

# 打開網址 https://localhost.webduino.io
# 跳回登入頁，登入後，請再手動將網址改成 https://localhost.webduino.io

打包

npm run build

# 打開網址 http://localhost:4173

執行預覽 (打包後)

npm run preview

部署更新時間

檢查部署更新時間，打開網頁開發者工具，html 元素上，可查看 data-time 屬性。

VSCode

建議可安裝套件

• Volar
• TypeScript Vue Plugin (Volar)

Type Support for .vue Imports in TS

在 Volar 套件，說明中，有要求關閉 vscode 內建的 typescript 功能，可見下方說明，或是參考官方連結。

TypeScript cannot handle type information for .vue imports by default, so we replace the tsc CLI with vue-tsc for type checking. In editors, we need TypeScript Vue Plugin (Volar) to make the TypeScript language service aware of .vue types.

If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a Take Over Mode that is more performant. You can enable it by the following steps:

1. Disable the built-in TypeScript Extension
   1. Run Extensions: Show Built-in Extensions from VSCode's command palette
   2. Find TypeScript and JavaScript Language Features, right click and select Disable (Workspace)
2. Reload the VSCode window by running Developer: Reload Window from the command palette.

開發分之說明

名稱	用途
develop	思維工具測試機
main	思維工具正式機
aitsky	思維工具台天版
egame	思維工具 Egame 版
next	小助教測試機
tutor	小助教正式機