最近在構建vue專案，整體已經完成，今天來總結總結。
1.專案搭建
2.專案結構
專案構建完了以後的結構就是這個樣子
*不包括dist資料夾（專案使用webpack打包後的資料夾，構建的專案中不包括此資料夾）
其中的index.html檔案是這個前端的頁面入口（單頁面應用）
接下來主要的開發工作都是在src目錄下
src目錄結構如上圖
1.assets是專案的所有檔案
2.components是所有的模組化元件，common為公共元件
3.jsdao下為公用的js方法
4.router為vue-router檔案
5.vuex為狀態管理的資料夾
7.main.js主要是new乙個vue物件
好的，接下來我們一一細說
1.assets檔案沒有什麼可說的了
2.components也就是元件
分為以下幾個部分
2.1元件的建立
新建乙個.vue檔案，新建完的檔案包括三個部分：(元件的html結構)，(元件的js檔案)，（元件的樣式檔案）
*在標籤內只能有乙個父級標籤，標籤有乙個屬性 scoped設定這個標籤可以使內部定義的樣式只在該元件內部有效
最核心的東西來了就是script標籤
一般情況下script內部的格式比較固定，如下
export default,
retimgurl: function(url)
},data ()
},methods:}}
這種寫法屬於es6的語法，當然了作為乙個熱愛新技術的前端，我推薦大家這麼做，其中的引數我來做詳細解釋
name:為該元件的名字（在元件內部呼叫自己本身時有用）；
props:父子通訊的媒介（引數為陣列）；
filters:過濾器常用作處理資料格式，路徑等，用法：是在filters內定義乙個處理的函式，如上面**中的turntime，呼叫方式為}或者
data:為元件的資料 *注意寫法
methods：為組建的方法
其中還有以下這些引數比較常用：
components：定義子元件
寫法如下：
import mytree from './common/treemenu.vue'
import userlist from './common/userlist.vue'
import puductinfo from './common/puductinfo.vue'
components:
然後就可以把components內定義的元件當做標籤來使用
mounted：el 被新建立的 vm.$el 替換，並掛載到例項上去之後呼叫該鉤子，其實就是該模組載入完成以後呼叫
watch：監聽資料物件或者方法的值的變化*如果資料為物件的話要監聽其鍵值對的變化需要新增deep屬性
好了，今天介紹完了整體以及元件內部的結構，後期我會分別介紹，vuex, vue-resouce,以及元件之間的通訊等
vuejs開發H5頁面總結
vuejs開發h5頁面總結 關於布局方案 當拿到設計師給的ui設計圖，前端的首要任務就是布局和樣式，相信這對於大部分前端工程師來說已經不是什麼難題了。移動端的布局相對pc較為簡單，關鍵在於對不同裝置的適配。之前介紹了一篇關於移動端rem布局方案，這大致是網易h5的適配方案。不過實踐中發現 開源的可伸...
使用Vue CLI3開發多頁面應用
一 安裝vue cli3 1 如果你已經全域性安裝了舊版本的vue cli 1.x 或 2.x 你需要先通過npm uninstall vue cli g或yarn global remove vue cli解除安裝它。2 安裝命令 npm install g vue cli 或 yarn glob...
使用skaffold持續開發應用
skaffold是乙個命令列工具，它為kubernetes native應用程式的持續開發提供了便利。skaffold處理build push和deploy應用程式的工作流，並提供用於建立ci cd管道的構建塊。這使您能夠在skaffold不斷部署到本地或遠端kubernetes集群時，專注於應用開...