摘要:故事背景前情提要自動工具,前端打字員的自我救贖的功能根據配置文件,在目標文件中自動導入規定目錄下自定義模塊,并監聽規定目錄下文件的變動,自動更新尚在測試中的使用安裝工具編寫配置文件需要自動導入的模塊的后綴名自動導入的模塊的來源目
故事背景
前情提要:自動 Import 工具,前端打字員的自我救贖
github: smart-import
smart-import 的功能根據配置文件,在目標文件中自動導入規定目錄下自定義模塊,并監聽規定目錄下文件的變動,自動更新
尚在測試中
smart-import 的使用安裝工具
npm install smart-import -g
編寫配置文件smart-import.json
{ "extname": ".vue", "from": "demo/pages", "to": "demo/router/index.js", "template": "const moduleName = () => import(modulePath)", "ignored": [ "demo/pages/pageA.vue", "demo/pages/**/*.js" ] }
extname:需要自動導入的模塊的后綴名
from:自動導入的模塊的來源目錄
to:目標文件
template:導入方式的模版
ignored:需要忽略的模塊
啟動工具
在命令行輸入
simport
smart-import 的誕生
smart-import作為命令行工具,和平常寫網站還是有些不同的。
同樣的部分,github建倉庫,npm init
通過npm init會生成package.json文件,其中main字段的作用在于,如果你的代碼最終作為一個模塊被其他人import/require,那么這個文件就是這個模塊的入口文件,可以參考node加載模塊的機智
摘自npm官方文檔
The main field is a module ID that is the primary entry point to your program. That is, if your package is named foo, and a user installs it, and then does require("foo"), then your main module"s exports object will be returned.This should be a module ID relative to the root of your package folder.
For most modules, it makes the most sense to have a main script and often not much else.
由于smart-import是一個命令行工具,并不會被其他人import/require,所以main字段可以忽略;而要注意的是bin字段
"bin": { "simport": "./bin/index.js" },
摘自npm官方文檔
A lot of packages have one or more executable files that they"d like to install into the PATH. npm makes this pretty easy (in fact, it uses this feature to install the "npm" executable.)To use this, supply a bin field in your package.json which is a map of command name to local file name. On install, npm will symlink that file into prefix/bin for global installs, or ./node_modules/.bin/ for local installs.
簡單來說,就是將你的腳本放到環境變量中
而在你的腳本的第一行務必要加上
#!/usr/bin/env node
用于告訴計算機用 node 來運行這段腳本
在測試自己的腳本之前要把運行
npm install -g
把自己的腳本鏈接到環境變量中,不然會被告知該命令不存在
smart-import 的發布
先要有npm的賬號
然后給package添件賬號
npm adduser
之后可以通過npm whoami來核實自己的賬號信息
最后就是
npm publish
版本更新
npm version patch npm publish參考資料
https://docs.npmjs.com/files/...
https://developer.atlassian.c...
https://javascriptplayground....
https://www.sitepoint.com/jav...
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/92475.html
摘要:前情提要自動工具,前端打字員的自我救贖記第一次發布包經歷,是重構中的代碼是版本可以工作的代碼配置文件待導入的模塊引用模塊的文件引用模塊的方式忽略的模塊實現監聽文件的刪除和添加以上代碼主要使用了來監聽文件的變化。 前情提要 自動 Import 工具,前端打字員的自我救贖 記第一次發布npm包經歷,smart-import GitHub:smart-import develop是重構中的代...
摘要:記使用方式和之前版本的差異的使用下載和安裝項目生成的目錄結構以上,目前版本的使用下載和安裝項目生成的目錄結構新的目錄結構,隱藏了配置文件,封裝了細節對比個區別區別下載包的包命變化。貌似是之前的版本有點問題 記vue-cli@3.0使用方式和之前版本的差異 @2.9.3的使用 1.下載vue-cli和安裝項目 cnpm i -g vue-cli#2.9.3 vue init webpa...
摘要:前言這里是發布包的具體步驟,手把手教會,相關原理在其他文章下面有原理好文章指路分鐘教你快速開發一個插件并發布手把手教你封裝一個發布之前,需要注冊一個賬號這里注冊具體步驟新建項目如需安裝代碼下面新建一個文件夾。 前言 這里是發布npm包的具體步驟,手把手教會,相關原理在其他文章下面有原理好文章指路10分鐘教你快速開發一個vue插件并發布npm 手把手教你封裝一個 vue componen...
摘要:文章介紹如何創建發布一個包,包括項目搭建發布流程注意事項等。語義化版本號分為三位。主版本號當進行了大都改動或者對有很多不兼容修改時應該進行版本號升級。次版本號增加了部分特性或者優化時升級該版本。如如果你想撤回指定版本,執行包名版本號。 文章介紹如何創建發布一個npm包,包括項目搭建、發布流程、注意事項等。 演示代碼GitHub地址 1. 初始化項目 首先在創建好的項目文件夾下面執行 ...
閱讀 1415·2021-10-08 10:05
閱讀 3060·2021-09-26 10:10
閱讀 882·2019-08-30 15:55
閱讀 503·2019-08-26 11:51
閱讀 440·2019-08-23 18:10
閱讀 3848·2019-08-23 15:39
閱讀 658·2019-08-23 14:50
閱讀 767·2019-08-23 14:46