Fork me on GitHub

【WePY小程序框架实战一】-创建项目

最近两个小程序项目使用了微信自己出的框架wepy开发,开发完的感受就是比原生小程序顺溜很多。我就从安装到一些重点和整个项目把wepy使用整理下

全局安装WePY命令行工具

npm install wepy-cli -g

创建项目

wepy init standard mywepy

选择->回车

? Project name mywepy
? AppId wx30b76facba36e27b
? Project description test
? Author leinov <1425795233@qq.com>
? Use ESLint to lint your code? No
? Use Redux in your project? Yes
? Use web transform feature in your project? Yes

进入项目目录

cd mywepy

安装依赖包

npm install

实时编译

wepy build --watch

项目结构

├── dist                   小程序运行代码目录(该目录由WePY的build指令自动编译生成,请不要直接修改该目录下的文件)
├── node_modules           
├── 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配置

添加项目

一些配置

  • es6: 对应关闭ES6转ES5选项,关闭。 重要:未关闭会运行报错。

  • postcss: 对应关闭上传代码时样式自动补全选项,关闭。 重要:某些情况下漏掉此项也会运行报错。

  • minified: 对应关闭代码压缩上传选项,关闭。重要:开启后,会导致真机computed, props.sync 等等属性失效。(注:压缩功能可使用WePY提供的build指令代替,详见后文相关介绍以及Demo项目根目录中的wepy.config.js和package.json文件。)

  • urlCheck: 对应不检查安全域名选项,开启。 如果已配置好安全域名则建议关闭。

posted @ 2018-08-28 15:17  飞河  阅读(3248)  评论(0编辑  收藏  举报
Fork me on GitHub