webpack基礎總結

1.使用#

webpack版本問題###

目前有兩個主版本,一個是在 master 主干的穩(wěn)定版扑眉,一個是在 webpack-2 分支的測試版昼捍,測試版擁有一些實驗性功能并且和穩(wěn)定版不兼容翠肘,在正式項目中應該使用穩(wěn)定版。

#查看webpack版本信息
npm info webpack

#安裝指定版本webpack
npm install webpack@1.14.0 --save-dev

安裝###

npm install webpack -g

查看###

webpack -h

使用項目本地版本的webpack###

# 進入項目目錄
# 確定已經有 package.json伤溉,沒有就通過 npm init 創(chuàng)建
# 安裝 webpack 依賴
npm install webpack --save-dev

webpack開發(fā)工具###

npm install webpack-dev-server --save-dev

2.使用#

①創(chuàng)建一個靜態(tài)頁面index.html和一個js入口文件entry.js:####

<!-- index.html -->
<html>
<head> <meta charset="utf-8"></head>
<body> 
    <script src="bundle.js"></script>
</body>
</html>
// entry.js
document.write('It works.')

②編譯

webpack entry.js bundle.js

③添加模塊并修改entry.js

document.write(require('./module.js')) // 添加模塊

Loader#

安裝使用Loader####

#entry.js
require('./style.css')
#有些環(huán)境下可能使用雙引號
webpack entry.js bundle.js --module-bind 'css=style!css'
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末般码,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子谈火,更是在濱河造成了極大的恐慌侈询,老刑警劉巖,帶你破解...
    沈念sama閱讀 210,978評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件糯耍,死亡現場離奇詭異扔字,居然都是意外死亡,警方通過查閱死者的電腦和手機温技,發(fā)現死者居然都...
    沈念sama閱讀 89,954評論 2 384
  • 文/潘曉璐 我一進店門革为,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人舵鳞,你說我怎么就攤上這事震檩。” “怎么了蜓堕?”我有些...
    開封第一講書人閱讀 156,623評論 0 345
  • 文/不壞的土叔 我叫張陵抛虏,是天一觀的道長。 經常有香客問我套才,道長迂猴,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,324評論 1 282
  • 正文 為了忘掉前任背伴,我火速辦了婚禮沸毁,結果婚禮上,老公的妹妹穿的比我還像新娘傻寂。我一直安慰自己息尺,他們只是感情好,可當我...
    茶點故事閱讀 65,390評論 5 384
  • 文/花漫 我一把揭開白布疾掰。 她就那樣靜靜地躺著搂誉,像睡著了一般。 火紅的嫁衣襯著肌膚如雪静檬。 梳的紋絲不亂的頭發(fā)上炭懊,一...
    開封第一講書人閱讀 49,741評論 1 289
  • 那天浪汪,我揣著相機與錄音,去河邊找鬼凛虽。 笑死,一個胖子當著我的面吹牛广恢,可吹牛的內容都是我干的凯旋。 我是一名探鬼主播,決...
    沈念sama閱讀 38,892評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼钉迷,長吁一口氣:“原來是場噩夢啊……” “哼至非!你這毒婦竟也來了?” 一聲冷哼從身側響起糠聪,我...
    開封第一講書人閱讀 37,655評論 0 266
  • 序言:老撾萬榮一對情侶失蹤荒椭,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后舰蟆,有當地人在樹林里發(fā)現了一具尸體趣惠,經...
    沈念sama閱讀 44,104評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年味悄,在試婚紗的時候發(fā)現自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片塌鸯。...
    茶點故事閱讀 38,569評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖丙猬,靈堂內的尸體忽然破棺而出涨颜,到底是詐尸還是另有隱情茧球,我是刑警寧澤,帶...
    沈念sama閱讀 34,254評論 4 328
  • 正文 年R本政府宣布袜腥,位于F島的核電站见擦,受9級特大地震影響羹令,放射性物質發(fā)生泄漏。R本人自食惡果不足惜福侈,卻給世界環(huán)境...
    茶點故事閱讀 39,834評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望肪凛。 院中可真熱鬧堰汉,春花似錦辽社、人聲如沸翘鸭。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,725評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至生蚁,卻和暖如春噩翠,著一層夾襖步出監(jiān)牢的瞬間邦投,已是汗流浹背伤锚。 一陣腳步聲響...
    開封第一講書人閱讀 31,950評論 1 264
  • 我被黑心中介騙來泰國打工志衣, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人蠢涝。 一個月前我還...
    沈念sama閱讀 46,260評論 2 360
  • 正文 我出身青樓玄呛,卻偏偏與公主長得像,于是被迫代替她去往敵國和親和二。 傳聞我的和親對象是個殘疾皇子徘铝,可洞房花燭夜當晚...
    茶點故事閱讀 43,446評論 2 348

推薦閱讀更多精彩內容

  • 無意中看到zhangwnag大佬分享的webpack教程感覺受益匪淺,特此分享以備自己日后查看惯吕,也希望更多的人看到...
    小小字符閱讀 8,147評論 7 35
  • 一.什么是 WebpackWebpack 是一個模塊打包器惕它。它將根據模塊的依賴關系進行靜態(tài)分析,然后將這些模塊按照...
    nightZing閱讀 986評論 1 13
  • Webpack 是當下最熱門的前端資源模塊化管理和打包工具废登。它可以將許多松散的模塊按照依賴和規(guī)則打包成符合生產環(huán)境...
    stiller閱讀 595評論 0 3
  • 如果說神秘是不了描述的東西淹魄,我想,夢也如此堡距!有的人在過往的歲月里甲锡,也在夢里;有的人在即將的未來里羽戒,也在夢里缤沦;有的人...
    左羊右羽閱讀 252評論 0 0
  • 每一天都是不一樣的,改變隨時都會發(fā)生易稠。今天站樁站的很穩(wěn)缸废,身體重心一直保持在兩腿之間,沒有堅持不住了的感覺,不斷的將...
    閔靜閱讀 617評論 0 1