webpack4.0以後的版本 基於webpack5.0要出來了
你們可能會問 為啥要上傳配置
因為有時候配webpack來使用vue或者react
不是外掛程式更新 就是衝突 或者某乙個不能用了
所以我感覺自己摸索出來一套配置 用一段時間 方便 而已
免得麻煩浪費很多時間
.babelrc檔案
const path=
require
("path"
)const htmlwebpackplugin=
require
("html-webpack-plugin"
)//用於把html頁面放入記憶體
const vueload=
require
("vue-loader/lib/plugin"
)const minicss=
require
("mini-css-extract-plugin"
)以後的打包css檔案
const optimizecssassetswebpackplugin=
require
("optimize-css-assets-webpack-plugin"
)//壓縮如果你使用ui元件庫已經壓縮的css就別必要了
//這個是vue-loader15.0以後的版本
const htmlplugin=
newhtmlwebpackplugin()
const css=
newminicss()
module.exports=
, output:
,//production 提供了約定大於配置 約定打包檔案是src/index ->dist/main
plugins:
[ htmlplugin,
newvueload()
, css
], module:}]
,exclude:
/node_modules/},
//乙個屬性use:"babel-loader"兩個是陣列
// ,
,'css-loader']}
,// //import css from '路徑' console.log(css)會生成模組
// //這是react的處理辦法 vue就是style裡面寫scoped
// //支援id與class 控制台輸出的模組是健對值形式
// }//css scss less一樣的配置模組化
// }]},}]
},// ]},,]
},devtool:
"hidden-source-map"
,//inline把js打包在乙個檔案裡面 hidden分離出來 eval也是分離
optimization:
}}
package
.json
,"dependencies":,
"devdependencies"
:}
vue基本配置
1 build webpack.base.conf.js 原始碼配置解讀output 輸出 resolve 作一些設定 module rules 各類外掛程式 2 config index.js 重要配置 assetspulblicpath 上下文路徑 build.js 主要作用 構建生產包 配置 ...
vue路由配置，vue子路由配置
現在乙個專案已經部署完成，接下來我們從路由開始！還記得在初始化專案的時候，有提示是否需要安裝vue router，對沒錯，vue中路由全靠它！首先找到路由配置檔案 router index.js，是整個專案路由配置檔案 首先看最上面的，這個模組引入，es2015中的import.from.將你需要配...
vue基本總結
一.環境搭建 1 vue vue cli環境 安裝過程 全域性安裝 vue cli npm install global vue cli 建立乙個基於 webpack 模板的新專案 vue init webpack my project 安裝依賴，走你 cd my project npm insta...