国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

NPM — JavaScript 的包管理器

ZweiZhao / 3027人閱讀

摘要:是的默認模塊管理器,一個命令行下的軟件,用來安裝和管理模塊,同時也可以管理其他開放式的模塊代碼。的包管理器可以查看所有可使用的命令。發(fā)布記得在推之前先登錄要不然會報錯。最后需要把文件里面的刪除掉要不然上傳時會忽略掉打包的文件。

本文主要介紹npm的常用命令,以及如何發(fā)布一些常用的js模塊化代碼到npm上面方便日后的使用,和舉例如何把一個vue組件打包發(fā)布到npm到最后下載到本地使用的過程。

npm(Node Package Manager)是node的默認模塊管理器,一個命令行下的軟件,用來安裝和管理node模塊,同時也可以管理其他開放式的js模塊代碼。npm有一個好處是除了下載需要的模塊外還會幫我們解決依賴關(guān)系,同時下載所依賴的模塊。

NPM —— JavaScript 的包管理器 npm help
    access, adduser, bin, bugs, c, cache, completion, config,
    ddp, dedupe, deprecate, dist-tag, docs, doctor, edit,
    explore, get, help, help-search, i, init, install,
    install-test, it, link, list, ln, login, logout, ls,
    outdated, owner, pack, ping, prefix, prune, publish, rb,
    rebuild, repo, restart, root, run, run-script, s, se,
    search, set, shrinkwrap, star, stars, start, stop, t, team,
    test, tst, un, uninstall, unpublish, unstar, up, update, v,
    version, view, whoami

npm help 可以查看所有可使用的命令。

npm常用指令
npm install 名字      //該命令用于安裝模塊
npm uninstall 名字    //該命令用于卸載模塊
npm run 名字          //該命令用于執(zhí)行腳本
如何用npm發(fā)布自己的模塊

我們所有下載以及發(fā)布的包是存放在這個地址:https://www.npmjs.com/
我們發(fā)布一個東西,得要有自己的標識吧,所以得先注冊賬號。

1.注冊用戶
npm adduser
運行該命令后會需要你依次輸入
Username:
Password:
Email:
2.檢查

接下來是需要檢查一下有沒有注冊成功

npm whoami
3.建立package
npm init
//一路回車
name: (dateFormat) datechange
version: (1.0.0) 
description: change date format
entry point: (index.js) 
test command: 
git repository: https://github.com/shuangmuyingzi/dateFormat.git
keywords: dateformat date datechange
author: lingzi
license: (ISC) 
About to write to /Users/linziying/Downloads/npm/dateFormat/package.json:

{
  "name": "datechange",
  "version": "1.0.0",
  "description": "change date format",
  "main": "index.js",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/shuangmuyingzi/dateFormat.git"
  },
  "keywords": [
    "dateformat",
    "date",
    "datechange"
  ],
  "author": "lingzi",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/shuangmuyingzi/dateFormat/issues"
  },
  "homepage": "https://github.com/shuangmuyingzi/dateFormat#readme"
}


Is this ok? (yes) 

然后會在該目錄下多了個package.json文件

添加簡單的日期轉(zhuǎn)換格式插件

每次后臺數(shù)據(jù)接口返回的基本是時間戳,往往需要轉(zhuǎn)換成常用的日期格式。那我就以一個簡單的日期轉(zhuǎn)換格式小插件為例。把下面代碼放到package.json文件同級目錄里。

date.js

(function(global) {
    var datechange = (function() {
      
      return function (date) {
  
        date = date || new Date;
  
        if(!(date instanceof Date)) {
          date = new Date(date);
        }
  
        if (isNaN(date)) {
          throw TypeError("Invalid date");
        }
        let re = date.getFullYear() + "." + (date.getMonth()+1) + "." + date.getDate();
        return re
  
      }
  })()

  if (typeof define === "function" && define.amd) {
    define(function () {
      return datechange;
    });
  } else if (typeof exports === "object") {
    module.exports = datechange;
  } else {
    global.datechange = datechange;
  }

})(this);
4.發(fā)布

npm publish
記得在推之前先登錄npm要不然會報錯。如果是再次推送同一個項目記得修改版本號。

使用
npm install --save-dev datechange
var datechange = require("datechange");
var now = new Date();
var timeStamp = datechange(now);

OR


    

先安裝后使用,包的名稱為package.json里的name屬性。
具體代碼看github:
https://github.com/shuangmuyi...

Vue組件如何上傳到NPM 方式一

用webpack把項目打包成JS文件,然后在package.json的 main導出該JS文件。

創(chuàng)建

vue-cli創(chuàng)建vue簡單項目

vue init webpack-simple load-ling-zi

修改package.json

修改"private": false

npm默認創(chuàng)建的項目是私有的,如果要發(fā)布至npm必須將其公開

添加"main": "dist/build.js"

通過`import loading from "load-ling-zi"`引用該組件時,項目會自動找到`node_modules/load-ling-zi/dist/build.js`

在src加入組件代碼App.vue, 并創(chuàng)建我們的導出文件index.js。
在index.js中添加:

import load from "./App.vue"
export default load
//global 情況下 自動安裝
if (typeof window !== "undefined" && window.Vue) {
  window.Vue.component("load", load);
}

因為最后我們是打包成一個js文件,所以需要修改一下配置文件webpack.config.js

因為不是所有使用你組件的人都是通過npm按住和impor的很多人是通過 方式二

在main里直接導出Vue組件(.vue文件)
具體代碼看這里:
https://github.com/shuangmuyi...

寫在最后

關(guān)于vue組件、插件的實現(xiàn)方式估計還有很多的辦法,本文權(quán)當拋磚引玉,水平有限,舉的例子也是比較簡單,一個好的組件也要考慮更多的可配置性以及通用性,數(shù)據(jù)的可配置,結(jié)構(gòu)的可配置,樣式的可配置等等,es里面模塊化的寫法也是很多,還有一些直接在

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/90060.html

相關(guān)文章

  • 煦涵說Yarn

    摘要:是一個新的包管理器,它由開發(fā)者共同開發(fā)完成。從包管理器中借鑒,創(chuàng)建了文件,用來記錄項目使用每個包的確切版本。感謝您的閱讀作者煦涵年月日下面是實驗室的微信公眾號二維碼,歡迎長按掃描關(guān)注 Yarn是一個新的Javascript包管理器,它由Facebook, Google, Exponent and Tilde開發(fā)者共同開發(fā)完成。Yarn 不是 NPM 的fork版本,而是它的重新設(shè)計,Y...

    pkhope 評論0 收藏0
  • yarn-新生代NPM

    摘要:僅僅一夜,卻也是無數(shù)個日夜,開源了這個新的包管理工具,這個和以及合作完成的項目。有兩種安裝模式,一種是下載腳本執(zhí)行,一種下載壓縮包解壓。。。這貨以后有取代的傾向。。。 yarn 僅僅一夜,卻也是無數(shù)個日夜,F(xiàn)aceBook 開源了 yarn 這個新的 JavaScript 包管理工具, 這個和 Exponent, Google, 以及 Tilde 合作完成的項目。 官網(wǎng) | Githu...

    Tony_Zby 評論0 收藏0
  • [譯]Yarn:一個新的JavaScript管理

    摘要:第一個主要的包管理器在被引用后不久就搭建起來了,并且迅速成為世界上最受歡迎的包管理器之一。簡介是一款新的包管理器,在取代客戶端和其他包管理器現(xiàn)有工作流的同時,又保留了對代理的兼容性。 在JavaScript社區(qū),工程師們分享了成百上千的代碼段,我們不用自己從頭編寫基礎(chǔ)組件、類庫或者框架。反過來,每段代碼又或許依賴于其它的代碼段,而這些依賴就是通過 package managers(包管...

    Steve_Wang_ 評論0 收藏0
  • node入門基礎(chǔ)

    摘要:入門是一門基于的后臺編程語言,由于其解析引擎為引擎,性能比較強大,再加上與前端語言關(guān)系更為密切的先天優(yōu)勢,使其在眾多后臺編程語言中脫穎而出。那么線程呢,線程,有時被稱為輕量級進程,,是程序執(zhí)行流的最小單元。 node入門 nodejs是一門基于JavaScript的后臺編程語言,由于其解析引擎為V8引擎,性能比較強大,再加上與前端語言關(guān)系更為密切的先天優(yōu)勢,使其在眾多后臺編程語言中脫穎...

    wujl596 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<