1.webpack 如何分離app(應(yīng)用程序)和vendor(第三方庫)入口廷蓉？
webpack.config.js
module.exports = {
entry: {
main: './src/app.js',
vendor: './src/vendor.js',
},
};
webpack.prod.js
module.exports = {
output: {
filename: '[name].[contenthash].bundle.js',
},
};
webpack.dev.js
module.exports = {
output: {
filename: '[name].bundle.js',
},
};
說明： 這樣配置是想要配置2個單獨的入口點， 解決的問題打包時vendor中引入模塊打包在一起成為單獨的chunk,內(nèi)容哈希保持不變盼产，這使瀏覽器可以獨立緩存他們，從而減少加載時間礼华。
Tip:
在 webpack < 4 的版本中咐鹤，通常將 vendor 作為一個單獨的入口起點添加到 entry 選項中，以將其編譯為一個單獨的文件（與 CommonsChunkPlugin 結(jié)合使用）圣絮。
而在 webpack 4 中不鼓勵這樣做祈惶。而是使用 optimization.splitChunks 選項，將 vendor 和 app(應(yīng)用程序) 模塊分開扮匠，并為其創(chuàng)建一個單獨的文件捧请。不要 為 vendor 或其他不是執(zhí)行起點創(chuàng)建 entry。）
webpack常用的用的plugins
- html-webpack-plugin ：根據(jù)同一個模板生成多個頁面
- extract-text-webpack-plugin
- UglifyJSPlugin ： js壓縮插件
- CommonsChunkPlugin ： 把多個頁面中公用的文件抽出
- clean-webpack-plugin ： 打包過程前清除以前的文件
- copy-webpack-plugin:
常用loader解析器
- css-loader （解析css文件）
- sass-loader/less-loader/node-sass （預(yù)編譯解析）
- file-loader/url-loader 解析圖片（png棒搜，jpg/svg/gif）
- 給css添加前綴： postcss-loader疹蛉，autoprefixer
loader執(zhí)行順序
loader是文件加載器； loader是從右至左調(diào)用的
plugin執(zhí)行
在webpack運行的生命周期中會廣播出許多的事件力麸，plugin可以監(jiān)聽這些事件可款，在合適的時機通過webpack提供的API改變輸出的結(jié)果；
執(zhí)行順序:webpack啟動后克蚂，在讀取配置的過程中會執(zhí)行new myplugin()初始化一個myplugin獲取實例闺鲸，在初始化compiler對象后，就會通過compiler.plugin監(jiān)聽到webpack廣播出來的事件
2.vue data數(shù)據(jù)中對象內(nèi)容更改沒有觸發(fā)組件更新
解決方式
// 假設(shè)
export default {
data() {
return: {
obj: {
a: 1,
b: 2,
}
}
},
mounted() {
this.obj.c = 3 // 這樣再插入數(shù)據(jù)時埃叭，對象本身沒有改變摸恍，也就意味著vue檢測不到數(shù)據(jù)內(nèi)存指向做更改，導(dǎo)致插入的數(shù)據(jù)不具備`getter/setter`的屬性
Object.assign(this.obj, { c: 3 }); //這種方式替換一個內(nèi)存指向完成數(shù)據(jù)變化
this.$set(this.obj, "c", "2"); // 通過vue實例提供的$set方法赤屋，在不改變指向的同時立镶，添加一個具備getter/setter屬性的值
}，
}
3. vue 動態(tài)渲染組件方式
我們之前曾經(jīng)在一個多標簽的界面中使用 is attribute 來切換不同的組件：
<component v-bind:is="currentTabComponent"></component>
注解： 通過使用保留的 <component> 元素类早，動態(tài)地綁定到它的 is 特性媚媒，我們讓多個組件可以使用同一個掛載點，并動態(tài)切換莺奔。根據(jù) v-bind:is="組件名" 中的組件名去自動匹配組件欣范，如果匹配不到則不顯示变泄。改變掛載的組件令哟，只需要修改is指令的值即可。
4.高階函數(shù)
函數(shù)的參數(shù)是函數(shù)妨蛹，或者函數(shù)的返回值是函數(shù)
5.git的操作
git fatch
git stash
