node+bower+gulp+webpack初見

2019獨角獸企業重金招聘Python工程師標準>>> hot3.png

node

node模塊管理是通過NPM(即 Node Package Manage,是 NodeJS 模塊管理工具)來處理各模塊之間的依賴。NPM按樹狀結構來管理的,支持某模塊的不同版本。

[前提是本機已安裝node、git環境],配置好某項目的npm配置文件package.json后,在當前項目目錄下用命令npm install 或npm install --save-dev安裝即可,自動將package.json中的模塊安裝到node-modules文件夾下。

*使用npm安裝一些包緩慢或安裝失敗,建議使用淘寶鏡像。

鏡像使用方法(三種辦法任意一種都能解決問題,建議使用第三種,將配置寫死,下次用的時候配置還在):
1.通過config命令
npm config set registry https://registry.npm.taobao.org?
npm info underscore (如果上面配置正確這個命令會有字符串response)
2.命令行指定
npm --registry https://registry.npm.taobao.org info underscore?
3.編輯 ~/.npmrc 加入下面內容
registry = https://registry.npm.taobao.org

搜索鏡像: https://npm.taobao.org
建立或使用鏡像,參考: https://github.com/cnpm/cnpmjs.org

bower

bower是使用nodejs開發,用于web包管理。web包通常認為由html+css+javascript構成。如果越來越多得開源項目都托管在github上,bower只需要將github上項目加上一個配置文件既可以使用bower方式使用安裝包。作為包管理,bower能提供添加新web包,更新web包,刪除web包,發布web包功能,管理包依賴。

bower是通過npm安裝和管理的:npm install -g bower?

配置好某項目的bower配置文件bower.json后,在當前項目目錄下用命令bower install安裝即可,自動將bower.json中的模塊安裝到bower-components文件夾下。

node.js

node.js 是一個事件驅動I/O服務端JavaScript環境,基于Google的V8引擎。目的是為了提供撰寫可擴展網絡程序,如Web服務。

npm vs bower

npm是用來下載安裝node js的第三方工具包,也可以用來發布你自己開發的工具包。

bower是一個web包管理的工具,管理一些js庫,比如說jquery,bootstrap等。通過bower,你就不用自己去找jQuery文件了,通過配置文件就可以自動完成了。

gulp

gulp:處理html壓縮/預處理/條件編譯,圖片壓縮,精靈圖自動合并等任務

gulpfile.js:gulp的配置文件,引入了所有的gulp子任務。參見gulp 入門

webpack

webpack是模塊化管理的工具,使用webpack可實現模塊按需加載,構建js/css任務,模塊預處理,模塊打包等功能。可學習webpack入門指南。

?

整合gulp & webpack

webpack是眾多gulp子任務中比較復雜的部分,主要對JS/CSS進行相關處理。
包括:模塊分析、按需加載、JS代碼壓縮合并、抽離公共模塊、SourceMap、PostCSS、CSS代碼壓縮等等...

轉載于:https://my.oschina.net/guoshuyun/blog/726716

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/542789.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/542789.shtml
英文地址,請注明出處:http://en.pswp.cn/news/542789.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

Java LinkedList公共布爾boolean offerFirst(Object o)方法(帶示例)

LinkedList公共布爾布爾offerFirst(Object o)方法 (LinkedList public boolean offerFirst(Object o) method) This method is available in package java.util.LinkedList.offerFirst(Object o). 軟件包java.util.LinkedList.offerFirst(Object o)中提供了此方法。 This metho…

hbuilder php mysql_xampp本地服務器+HBuilder配置php環境

HBuilder配置PHP環境:下載,運行HBuilder編輯器打開右側小窗口,點擊設置圖標—>設置web服務器—>外置web服務器輸入你想要瀏覽器運行的URL,點擊兩個確定,再重新點擊設置web服務器,選擇PHP類文件(選擇之…

百度地圖手機和電腦不一致_你可能不知道的電腦手機冷知識

各位好久不見呀,自科部科科又回來了!平時我們經常使用電腦,你可能以為你對電腦和手機了如指掌,然而下面的冷知識你知道多少個?01一臺電腦可以有多個桌面如果你熟練的使用多個桌面這個技巧那么就可以躲著家長領導偷懶了…

嵌套字典|python_Python | 如果不是,則使用嵌套,根據銷售額計算折扣

嵌套字典|pythonInput same amount and calculate discount based on the amount and given discount rate in Python. 輸入相同的金額,并根據Python中的金額和給定的折扣率計算折扣。 The discount rates are: 折扣率是: Amount Discount0-5000…

RHEL 7 中 systemctl 的用法(替代service 和 chkconfig)

2019獨角獸企業重金招聘Python工程師標準>>> 1、systemctl是RHEL 7 的服務管理工具中主要的工具,它融合之前service和chkconfig的功能于一體。可以使用它永久性或只在當前會話中啟用/禁用服務。 systemctl可以列出正在運行的服務狀態,如圖&am…

python實戰——發郵件

from email import encoders#負責編碼 from email.header import Header#負責處理郵件頭 from email.mime.text import MIMEText#構造郵件內容 from email.utils import parseaddr, formataddr#將輸入內容格式化 import smtplib#發送郵件模塊def _format_addr(s):#處理格式化文…

js 刷新div_vue.js備忘記錄(五) vue-router

如果我們采用SPA(單網頁應用)的設計方式,服務器會把前端文件一次性發過來,前端通過監聽url的改變,選擇展示那些內容,也就是前端路由一. 如何改變url但是頁面不刷新?方式一: 改變哈希值hash比如,我們隨便找一個網頁我們在瀏覽器控制臺輸入發現網站的url有了些改變查看network卻…

css div撐滿窗口高度_如何使用CSS將div的高度設置為窗口的100%?

css div撐滿窗口高度Introduction: 介紹: Hello there developers! Well, certainly if you are reading this article then that means that you have run into some trouble while creating your web page or website and if you are a beginner in this field, …

.net core image怎么保存_輕量級Vue圖片上傳插件——Vue-core-image-Upload

介紹vue-core-image-upload 是一款輕量級的 Vue.js 上傳插件,它可以支持的圖片的上傳,裁剪,壓縮。它同樣也支持在移動端的圖片處理,它定義了諸多上傳周期,你可以自由的進行流程控制。Githubhttps://github.com/Vanthin…

mysql確認半同步命令_怎么判斷mysql是否是半同步復制

AFTER_COMMIT(5.6默認值)master將每個事務寫入binlog ,傳遞到slave 刷新到磁盤(relay log),同時主庫提交事務。master等待slave 反饋收到relay log,只有收到ACK后master才將commit OK結果反饋給客戶端。AFTER_SYNC(5.7默認值,但5.6中無此模式…

stl iterator_在C ++ STL中使用const_iterator訪問字符列表的元素

stl iteratorIn this example, we are declaring a character list and pushing the characters from A to Z using a for loop and push_back() function and then accessing the elements using const_iterator. 在此示例中,我們聲明一個字符列表,并使…

《Linus Torvalds自傳》摘錄

轉自:http://www.ruanyifeng.com/blog/2012/09/linus_torvalds.html作者: 阮一峰日期: 2012年9月 3日除了程序員,大概很少人知道Linux操作系統。它的發明者Linus Torvalds,知道的人就更少了。他本人也很低調&#xff0…

python繪制條形圖例題_python matplotlib庫繪制條形圖練習題

練習一:假設你獲取到了2017年內地電影票房前20的電影(列表a)和電影票房數據(列表b),那么如何更加直觀的展示該數據? a ["戰狼2","速度與激情8","功夫瑜伽",&quo…

mysql驗證身份證號正確_通過SQL校驗身份證號碼是否正確

根據提供的身份證號碼信息驗證身份證號碼是否符合二代身份證規范,其中區域編碼網上可下載。使用數據庫為DB2,但目測可以通用身份證號碼第18位驗證算法從網上查得,具體驗證算法如下:1、將前面的身份證號碼17位數分別乘以不同的系數…

python學習記錄

python學習記錄schedule庫schedule庫 import schedule import time #引入schedule和timedef job():print("Working in progress...") #定義一個叫job的函數,函數的功能是打印Im working...#部署情況 schedule.every(10).minutes.do(job) #部署每10…

Python | 在屬性的幫助下實現setter和getter

In this program, we are implementing Properties. Python offers a better way to implement setters and getter with the help of properties by using attribute property. By default properties are getters so we have to declare setter part explicitly. 在此程序中&…

windows進入mysql

cd \wamp\bin\mysql\mysql5.6.17\bin\mysql -hlocalhost -uroot -p轉載于:https://blog.51cto.com/8818968/1835449

python爬取js動態網頁_Python 爬取網頁中JavaScript動態添加的內容(一)

當我們進行網頁爬蟲時,我們會利用一定的規則從返回的 HTML 數據中提取出有效的信息。但是如果網頁中含有 JavaScript 代碼,我們必須經過渲染處理才能獲得原始數據。此時,如果我們仍采用常規方法從中抓取數據,那么我們將一無所獲。…

mac mysql 忘記密碼 卸載_MySQL忘記密碼后重置密碼(Mac )

轉:http://www.cnblogs.com/lihuanqing/p/5623872.html安裝好MySQL以后,系統給了個默認的的密碼,然后不小心關了,慘了密碼沒有了。1、關閉mysql服務器 sudo /usr/local/mysql/support-files/mysql.server stop 也可以在系統偏好里…

MATLAB學習——變量、數組

變量、數組變量賦值顯示格式數組一維數組生成數組元素提取提取單個元素抽取二維數組生成數組提取提取單個元素提取子矩陣添加字符數組空數組變量 賦值 賦值語句一般形式:變量 數、字符或表達式 a 1 #自定義為雙精度double x x y 1*2*3顯示格式 可以…