-
extract-text-webpack-plugin插件
就是把非js代碼的text打包成一個(gè)靜態(tài)資源文件。
查看全部 -
數(shù)據(jù)綁定
vue組件
render函數(shù)****
生命周期方法
computed
查看全部 -
hot? 只渲染改動(dòng)部分，不會(huì)整個(gè)頁面重新渲染
#cheap-module-eval-source-map
查看全部 -
4. html-webpack-plugin? a.require進(jìn)來插件 b.在plugins里new一下
5.在webpack里用一些vue,react等框架時(shí)要用 webpack.DefinePlugin，里邊定義的process.env里的變量在webpack編譯以及我們自己寫代碼時(shí)判斷環(huán)境都去可以去調(diào)用，webpack在打包時(shí)會(huì)根據(jù)不同的環(huán)境變量去打包不同的代碼版本
查看全部 -
1.cross-env 不同平臺(tái)上設(shè)置環(huán)境變量的方式不同，cross-env幫助不同平臺(tái)寫同樣的代碼就可以執(zhí)行命令，eg: cross-env NODE_ENV=production (現(xiàn)在是mac寫法，window應(yīng)該寫set 加上cross-env就可以幫助統(tǒng)一了)
2.process.env.NODE_ENV (啟動(dòng)腳本時(shí)設(shè)置的環(huán)境變量全部存在于process.env這個(gè)對象里)
3.? ? XXX.devServer={}
查看全部 -
index.js
查看全部 -
1.新建一個(gè)空目錄 cd進(jìn)目錄，執(zhí)行npm init 可初始化出一個(gè)package.json文件
2.安裝需要的包 npm install 包名，舉例 npm install webpack vue vue-loader(install可簡寫i) 此處未區(qū)分dependency 和devdependency.? ?tips:安裝好后查看warn里是否還有依賴組件需要安裝，若有根據(jù)提示install
3.新建webpack.config.js配置文件（打包前端資源）
4.新建入口文件：
? ? a.index.js為開發(fā)入口文件 引入vue，實(shí)例化vue 掛載mount等
????b.webpack配置文件會(huì)根據(jù)配置將index.js編譯成一個(gè)瀏覽器可懂的生 產(chǎn)文件
6.指定webpack配置文件為之前定義好的：package.json的scripts中加入自定義命令 ，eg : "build":"webpack --config webpack.config.js"（指定項(xiàng)目的定制化webpack配置文件，防止調(diào)用全局webpack出現(xiàn)版本不一致等）
7.項(xiàng)目根目錄下執(zhí)行npm run build(build是我們6中寫好的命令)
8.還需了解的 render函數(shù)，webpack常用命令
查看全部 -
vue要使用jsx語法
查看全部 -
vue工程的搭建
?npm init
1、npm i webpack vue vue-loader
2、npm i css-loader vue-template-compiler
3、新建src目錄并在src下新建app.vue
4、在app.vue中編寫vue組件
5、在根目錄下新建webpack.config.js
查看全部 -
網(wǎng)絡(luò)優(yōu)化：
減少http請求
壓縮靜態(tài)資源文件
使用瀏覽器強(qiáng)緩存使瀏覽器的流量變更小、加載速度更快
重點(diǎn)難點(diǎn)不是業(yè)務(wù)開發(fā)、性能要求并不是很高，不會(huì)做在線ps一樣的應(yīng)用
最重要的是前端工程化的問題。
查看全部 -
課程目標(biāo)查看全部
-
課程目的查看全部
-
循環(huán)比較消耗資源:key用來標(biāo)明下次循環(huán)有沒有變動(dòng)，如果key相同他會(huì)復(fù)用這個(gè)節(jié)點(diǎn)，不會(huì)生成新的節(jié)點(diǎn)刪除原來的節(jié)點(diǎn)。這樣可以提高效率
查看全部 -
學(xué)習(xí)記錄：查看全部
-
npm init
npm install webpack vue vue-loader
查看全部
舉報(bào)