vue cli開發外掛程式

建立乙個空的資料夾，名字最好就是你的外掛程式的名字。

為了讓乙個 cli 外掛程式在 vue cli 專案中被正常使用，它必須遵循 vue-cli-plugin- 或者 @scope/vue-cli-plugin- 這樣的命名慣例。這樣你的外掛程式才能夠：

每行命令代表什麼意思可以參考我前面的部落格npm init

輸入一些基本的資訊，這些資訊會被寫入 package.json 檔案中。

建立乙個compontents 資料夾包含元件檔案；

建立乙個 button-test 資料夾包含 index.vue （隨意寫）和 readme.md（隨意下）說明檔案；

模板建立完之後，你應該在 generator/index.js 檔案中新增 api.render 呼叫：

module.

exports
= api =>

所以，通常的 cli 外掛程式目錄結構看起來像下面這樣：

.

├── readme.md
├── generator.js # generator（可選）
├── index.js # service 外掛程式
├── package.json
├── prompts.js # prompt 檔案（可選）
└── ui.js # vue ui 整合（可選）

為了發布外掛程式，你需要在 npmjs.com 上註冊並且全域性安裝 npm。如果這是你的第乙個發布的 npm 模組，請執行

npm login

提示

1. 發布外掛程式之前，確保你為它選擇了正確的名字！名字規範是 vue-cli-plugin-。

2. 在沒有發布過的外掛程式。

接下來發布外掛程式，到外掛程式的根目錄，在命令列執行下面的命令：

npm publish

成功發布後，你應該能夠使用 vue add 命令將你的外掛程式新增到使用 vue cli 建立的專案。

vue add vue-cli-plugin-button-test

vue cli引入postcss外掛程式

預設情況下vue loader 也是按postcss進行css載入的 故修改webpack配置檔案跟平時不太一樣 如下提供三種方法 以填入tailwindcss外掛程式為例 1 直接在根目錄的postcssrc.js新增外掛程式 外掛程式名稱用引號括住 後面的大括號是外掛程式選項 2 刪除postc...

vue cli常用外掛程式集合

express vue 簡單的使用伺服器端渲染vue.js vue ssr 非常簡單的vuejs伺服器端渲染模板 vue ssr 結合express使用vue2服務端渲染 vue easy renderer nodejs服務端渲染 vue zhihu daily 知乎 with vuejs vue2...

npm發布Vue CLI3外掛程式

目錄結構 由於修改了src資料夾,啟動vue專案後,找不到入口 main.js 會報錯,所以需要重新指定啟動入口 a.youngform 是乙個資料夾,下面有 dynamicform.vue 和 index b.dynamicform.vue 是元件 export default export de...