移動端項目構造(結合項目實際狀況)

1.重置瀏覽器默認樣式;導入基礎公共樣式; App.vue <style lang="sass"> @import "../scss/base.scss";  sass語法須要安裝:node-sass、sass、sass-loader依賴; </style>
或者 <style lang="less"> @import "../less/base.less"; less語法須要安裝less、less-loader依賴; </style>
或者 <style> @import "../css/base.css"; css語法通常默認有依賴沒有則須要下載style-loader、css-loader; </style>
引入字體圖標, 在App.vue的style標籤裏面;(通常爲阿里圖庫項目圖標) @import url('//at.alicdn.com/t/font_nfzwlroyg2vuz0k9.css') ------------------------------------------------------------
2.rem 適配 推薦用淘寶js作主流設備的兼容性; flexible.js ------------------------------------------------------------
3.調試(安裝eruda命令:cnpm i eruda -S)和模擬數據(安裝mock.js命令cnpm i mockjs -S) // 只有在本地開發環境才加載vconsole 便於調試
if (process.env.NODE_ENV !== 'production') { require('eruda').init() } // 引入mock模擬本地開發數據
if (process.env.NODE_ENV == 'mock') { require('../mock/') } ------------------------------------------------------------
4.安裝 babel-polyfill(命令cnpm i babel-polyfill -S)ES6 用於解決瀏覽器不支持原生功能的代碼 ------------------------------------------------------------
5.安裝 axios 或者 其餘ajax封裝庫如fetch(新一代api)、vue-resource(中止維護)用於請求數據 ------------------------------------------------------------
6.安裝vuex(視項目狀況大小數據複雜程度決定) ------------------------------------------------------------
7.安裝fastclick解決移動端點擊300ms延遲(main.js) import FastClick from 'fastclick' FastClick.attach(document.body); ------------------------------------------------------------
8.修改main.js渲染方式(可要可不要建議這種) new Vue({ el: '#app', router, render: h => h(App) }) ------------------------------------------------------------
9.路由懶加載(一下兩種方式都行第一種爲webpack自帶) 讓路由按需加載,當須要用到的時候,纔去加載對應的組件,利用webpakc的異步加載能夠解決; const Car = r => require.ensure([], () => r(require('@/components/car')), 'car') //webpack自帶 const Car = resolve => require(['@/components/car'], resolve) //commonJS寫法
component: () => import('./components/Item.vue') //Es6寫法
------------------------------------------------------------
10.異步組件(高級)看項目需求通常建議 components: { searchSearch: function (resolve) { //異步組件寫法
     require(['./xxx.vue'], resolve) } } ------------------------------------------------------------
11.git/svn提交代碼具體操做本身拿一個倉庫去試;
相關文章
相關標籤/搜索