①步驟超級詳細。② 截圖超級詳細。 ③ 附**。
目錄
一、製作npm外掛程式。
1、註冊npm賬號。
2、本地建立專案。
2.1、命令列使用vue-cli建立乙個webpack專案。
2.2、在src下新建testqzz。
2.3、把下面**分別複製進index.js和test.vue中。
2.4、上傳到npm。
二、安裝npm外掛程式到本地專案。
2.1、安裝外掛程式。
2.2、引入外掛程式。
2.3、使用外掛程式。
開啟npm官網,使用郵箱註冊乙個賬號(用記事本記下賬號密碼,待會要用)。
我的演示步驟配置如下,你可以根據需求自我配置。
然後①cd abc ②npm install③ npm run dev啟動專案。
// 匯入自定義元件
import test from "./test.vue";
// ...... 可以匯入更多自定義元件
// import test2 from "./test2.vue";
const test =
};export default test;
命令列開啟testqzz資料夾,然後npm init。一路回車。
輸入npm login.然後輸入第一步中的賬號密碼。(輸入密碼時不顯示密碼,繼續輸就行了)。
最後一步:npm publish.**發布成功。一分鐘之後可以去npm官網搜尋一下你的包名。恭喜你。
使用npm i testqzz -d 安裝你的外掛程式到任意乙個本地vue專案。你可以在node_modules資料夾下找到你的npm外掛程式(這是我的另乙個測試外掛程式,所以包名不是testqzz,但是**和testqzz是一樣的)
開啟src/main.js檔案
在裡面新增語句,之後在任意乙個vue元件中使用引入你建立的外掛程式了。
結果:
製作乙個vue外掛程式
myplugin.install function vue,options 2.新增全域性資源 vue.directive my directive 3.注入元件 vue.mixin 4.新增例項方法 vue.prototype.mymethod function methodoptions 用 b...
分享乙個使用NSIS製作安裝包的UI外掛程式
做軟體開發以來,接觸的安裝包製作方式也有幾種了,從最原始的msi安裝包方式,到innosetup,再到nsis 但一直都是使用其指令碼功能,並沒有在介面上做一些美化操作。很早之前就想做乙個介面可以自由定製的安裝包工具,一直沒有時間,就放下了。最近有業務要求需要做到介面高度美觀且要求便於維護,這就促使...
簡單製作乙個npm包,並發布
exports.run function npm loginnpm publishexports.run function 1 修改包的版本 package.json中的 version 2 npm login 3 npm publishconst npmdemo1 require npmdemo1...