需要部署的內容

需要部署的東西有阿裏圖標、public(共享的js、wxss、wxml)、app.js、app.json、wxParse(html代碼轉view)、js插件(md5.js、base64.js)、static

阿裏圖標部署

詳細操作參考：http://www.cnblogs.com/wesky/p/7593115.html

public部署

目錄結構

area.js 存放的是網站上的省市區數組數據。為什麽會放到本地呢？原因一：小程序的ajax有時候很坑爹。原因二，省市區數據使會很頻繁，放本地比放服務器更好。原因三：小程序本身自帶的也有省市區數據，但是與商城的不符合

inc.js 存放的大部分都是跳轉，比如：跳轉首頁、分頁、會員中心、商品詳情、搜索 等js事件

menu.wxml 存放的是懸浮的通用底部菜單、商品列表盒子。只要是通用的模板盒子，都可以放著一個文件。

style.wxss 存放的是通用樣式，比如菜單樣式、商品盒子樣式、page樣式

擴展：menu.wxml 的代碼和調用

<!-- 通用底部浮窗 -->
<template name="menu-footer">
  <view class="fix-footer float-wrap">
    <view class="float-li {{nav[0].menu}}">
        <view class=‘li-text‘  catchtap="hrefHome">
            <text class="iconfont icon-home{{nav[0].ico}} li-ico"></text>
            <text class="li-h6">首頁</text>
        </view>   
    </view>
    <view class="float-li {{nav[3].menu}}">
        <view class=‘li-text‘  catchtap="hrefCategory">
            <text class="iconfont icon-fenlei{{nav[3].ico}} li-ico"></text>
            <text class="li-h6">分類</text>
        </view>   
    </view>
    <view class="float-li">
        <view class=‘li-text {{nav[1].menu}}‘  catchtap="hrefCart">
            <text class="iconfont icon-gouwuche{{nav[1].ico}} li-ico"></text>
            <text class="li-h6">購物車</text>
        </view>   
    </view>
    <view class="float-li">
        <view class=‘li-text {{nav[2].menu}}‘ catchtap="hrefUser">
            <text class="iconfont icon-huiyuan{{nav[2].ico}} li-ico"></text>
            <text class="li-h6">我的</text>
        </view>   
    </view>
  </view>
 
</template>

<!-- 商品詳情 底部浮窗-->
<template name="menu-goods">
    <view style="height: 100rpx"></view>
    <view class="fix-goods-footer">
        <view class="float-li s1 home" catchtap="hrefHome">
            <text class="iconfont icon-home1 li-ico"></text>
            <text class="li-h6">首頁</text>
        </view>
        <view class="float-li s1 kefu" style=‘position:relative‘>
            <text class="iconfont icon-huiyuan li-ico"></text>
            <text class="li-h6" >客服</text>
            <contact-button class="contact" type="default-light" size="12" session-from="weapp" style="opacity:0;position:absolute;top:1rpx;left:1rpx;color:#ff0">
        </contact-button> 
        <contact-button class="contact" type="default-light" size="12" session-from="weapp" style="opacity:0;position:absolute;top:0rpx;left:50rpx;color:#ff0">
        </contact-button> 
        <contact-button class="contact" type="default-light" size="12" session-from="weapp" style="opacity:0;position:absolute;top:50rpx;left:1rpx;color:#ff0">
        </contact-button> 
        <contact-button class="contact" type="default-light" size="12" session-from="weapp" style="opacity:0;position:absolute;top:50rpx;left:50rpx;color:#ff0">
        </contact-button> 

        </view>
        <view class="float-li s1" catchtap="hrefCart" style=‘position:relative‘>
            <text class="iconfont icon-gouwuche1 li-ico"></text>
            <text class="li-h6">購物車</text>
            <view class="cart-number">{{carNum}}</view>
        </view>
        <view class="float-li s2 add-cart" catchtap="attrShow" data-isbuy="0">加入購物車</view>
        <view class="float-li s2 buy" catchtap="attrShow" data-isbuy="1">立即購買</view>
    </view>
</template>

其它頁面調用，import導入，data是傳參：

<import src="../public/wxml/menu.wxml"/>
<template is="menu-footer" data="{{nav: footNav}}"/>

app.js部署

1.所有請求的api鏈接

App({
   api:[
        goods:‘https://xxx.com/goods‘,    // 商品數據
        category:‘https://xxx.com/category‘,   // 分類數據
        search:‘https://xxx.com/search‘    // 搜索數據
    ] 
})

推薦api地址部署再app.js裏面（部署再其它地方問題也不大，比如public/xxx）　　

2.登錄

登錄小程序功能是部署再app.js裏面的

app.json部署

主要是部署pages下的參數，這個關系到你小程序新建的文件夾及文件

{
  "pages":[
    "pages/index/index",
    
    "pages/logs/logs",

    "pages/cart/index",
    
    "pages/goods/index",

    "pages/user/user",
    "pages/address/index",
    "pages/address/edit",
    
    "pages/set/index",
    "pages/pay/index",
    "pages/order/index",
    "pages/order/info",
    "pages/test/index",

    "pages/coupon/index",
    "pages/coupon/user",
    "pages/category/index",
    "pages/category/goods",
    "pages/search/index",
    "pages/activity/hot" 
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  }
}

在這裏建立好名稱，它會自動幫你生成文件夾及文件（wxml、js、json、wxss）。

window是控制小程序的窗口參數，比如窗口顏色、導航字體顏色

wxParse部署

應用場景：小程序調用商城商品詳情。小程序本身是不支持html代碼的，有了這個插件，就可以做到兼容。

教程：http://www.cnblogs.com/wesky/p/8066233.html

js插件

md5、base64 這js插件看情況使用

重點：圖片內容不要部署本地，最好放到服務器上。小程序大小只有2M

小程序筆記二：部署