?

? ? ? ? ?參考地址：1、https://nodejs.org/en/? ? ? ? ? ? ? ? （ 電腦先下載node.js? ?他提供了 npm這個工具? ?（最好搞成淘寶鏡像? ?http://www.runoob.com/nodejs/nodejs-tutorial.html ? ））

? ? ? ? ? ? ? ? ? ? ? ? ? ?2、https://www.jianshu.com/p/42e11515c10f? ? ? ? （謝謝博主，好人一生平安）

? ? ? ? ? ? ? ? ? ? ? ? ? ?3、http://www.jqhtml.com/7626.html? ? （一些loaders 什么的在這里找方便些）

? ??

? ? ? ? 一、 先了解一點基礎概念

? ? ? ? ? ? ? ? ?1、入口(Entry) ：打包時執行的第一個文件

? ? ? ? ? ? ? ? ?2、出口(Output)：打包完后將你所有引入的文件（js、css、vue....）整合成一個文件后，輸出到的指定地址

? ? ? ? ? ? ? ? ?3、加載器(Loader)：整合成一個文件時對引入文件轉換的工具

? ? ? ? 二、具體流程

? ? ? ? ? ? ? ? 1、 創建 文件夾 ui_web? ?

? ? ? ? ? ? ? ? ?2、在根目錄下創建兩個文件夾（app 、public）

? ? ? ? ? ? ? ? ?3、在根目錄下創建??webpack.config.js、在app文件下創建main.js作為入口文件、在public創建index.html 文件（你要看到的頁面）

? ? ? ? ? ? ? ? ?4、ui_web這個文件夾下執行 npm_install? ?

? ? ? ? ? ? ? ? ?5、npm init? ?（填寫項目名、作者、版本等信息）保存后生成? ?package.json 文件

? ? ? ? ? ? ? ? package.json 內容：

? ? ? ? ? ? ? ? ?

? ? ? ? ? ? ? ? webpack.config.js內容：

? ? ? ? ? ? ? ? ?

? ? ? ? ? ? ? ?index.html （內容太多，不全截圖了，最重要的時引入 整個后bundle.js文件）

? ? ? ? ? ? ? ? ?

?

?main.js：入口文件

?

最后控制臺執行：webpack

? ? ? ? ? ? ? ? ?

轉載于:https://www.cnblogs.com/weiyuanquyu/p/8203714.html

總結

以上是生活随笔為你收集整理的webpack构建vue项目的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。