webpack 的簡單實用

  1. 首先需要安裝node ,不確定自己有沒有安裝node,使用命令
    node -v
image.png
  1. 初始化下,點回車就好了
image.png
image.png

3.安裝webpack

image.png

4.新建個entry.js文件
寫入document.write("It works.");
5.新建個index.html文件

<html>
<head>
    <meta charset="utf-8">
</head>
<body>
    <script type="text/javascript" src="bundle.js" charset="utf-8"></script>
</body>

</html>
6.在運行如下命令
$ webpack ./entry.js bundle.js

image.png

7.這時候你的demo 里面會有bundle.js 這個文件,這個就是打包之后的文件

image.png

8.這時候去打開index.html ,瀏覽器就會出現你寫入的內容

image.png

一個簡單的使用就完成了,你想了解更多,請去看api 吧。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 無意中看到zhangwnag大佬分享的webpack教程感覺受益匪淺,特此分享以備自己日后查看,也希望更多的人看到...
    小小字符閱讀 8,226評論 7 35
  • GitChat技術雜談 前言 本文較長,為了節省你的閱讀時間,在文前列寫作思路如下: 什么是 webpack,它要...
    蕭玄辭閱讀 12,710評論 7 110
  • 學習流程 參考文檔:入門Webpack,看這篇就夠了Webpack for React 一. 簡單使用webpac...
    Jason_Zeng閱讀 3,176評論 2 16
  • webpack 介紹 webpack 是什么 為什么引入新的打包工具 webpack 核心思想 webpack 安...
    yxsGert閱讀 6,496評論 2 71
  • 早就知道這一天會到來,像現在這樣,大腦空白,真是寫無可寫。但是對于勵志要堅持每天寫東西的我來說必須得想點辦法啊。...
    冬江花月夜閱讀 367評論 1 1