小程序之wepy框架

安裝cnpmnode

npm install -g cnpm --registry=https://registry.npm.taobao.orgnpm

cnpm -vjson

cnpm i小程序

一,wepy的安裝

1,全局安裝wepy   =>   npm i wepy-cli -g微信

2,新建項目project(項目名稱) => wepy new project           wepy init standard myprojectbabel

3,啓動項目 => wepy build --watch微信開發

 

二,生成的項目結構

├── dist 微信開發者工具指定的目錄(該目錄由WePY的build指令自動編譯生成,請不要直接修改該目錄下的文件)app

├── node_modules         xss

├── src                    代碼編寫的目錄(該目錄爲使用WePY後的開發目錄)工具

|  ├── components        WePY組件目錄(組件不屬於完整頁面,僅供完整頁面或其餘組件引用)

|  |  ├── com_a.wpy      可複用的WePY組件a

|  |  └── com_b.wpy      可複用的WePY組件b

|  ├── pages              WePY頁面目錄(屬於完整頁面)

|  |  ├── index.wpy      index頁面(經build後,會在dist目錄下的pages目錄生成index.js、index.json、index.wxml和index.wxss文件)

|  |  └── other.wpy      other頁面(經build後,會在dist目錄下的pages目錄生成other.js、other.json、other.wxml和other.wxss文件)

|  └── app.wpy            小程序配置項(全局數據、樣式、聲明鉤子等;經build後,會在dist目錄下生成app.js、app.json和app.wxss文件)

└── package.json          項目的package配置

 


這時啓動的項目還須要安裝  「babel-preset-es2015「和 「babel-preset-stage-1」,

文件wepy.config.js主要配置以下:

babel: {

      sourceMap: true,

      presets: [

        'es2015',

        'stage-1'

      ],

      plugins: [

          'transform-decorators-legacy',

          'transform-export-extensions',

          'syntax-export-extensions'

      ]

做者:喜歡喝橙汁的 連接:https://www.jianshu.com/p/6943413dc7dd 來源:簡書 簡書著做權歸做者全部,任何形式的轉載都請聯繫做者得到受權並註明出處。
相關文章
相關標籤/搜索