wepy快速入门

浅浅的花香味﹌ 2021-09-19 10:18 511阅读 0赞

Github地址

wepy官网：[https://tencent.github.io/wepy/index.html][https_tencent.github.io_wepy_index.html]

安装 wepy 命令行工具

npm install wepy-cli -g

在开发目录生成开发DEMO

wepy new myproject

开发实时编译

wepy build --watch

npm install -g wepy-cli  //全局安装或更新WePY命令行工具（wepy脚手架）： wepy-cli
    wepy -v //查看wepy-cli版本
    wepy init standard <projectName> //新建wepy小程序项目,1.7.0之前的版本使用：wepy new myproject
    wepy list //查看项目模板
    cd <projectName> //切换至项目目录
    npm  install //安装依赖
    wepy build --watch //开启实时编译

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM2MjMyNjEx_size_16_color_FFFFFF_t_70]  
WePY项目的目录结构

├── 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配置

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM2MjMyNjEx_size_16_color_FFFFFF_t_70 1]

project.config.json文件内容如下：

{
      "description": "project description",
      "setting": {
        "urlCheck": true,
        "es6": false,
        "postcss": false,
        "minified": false
      },
      "compileType": "miniprogram",
      "appid": "touristappid",
      "projectname": "Project name",
      "miniprogramRoot": "./dist"
    }

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

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

minified: 对应关闭代码压缩上传选项，关闭。重要：开启后，会导致真机computed, props.sync 等等属性失效。

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

[https_tencent.github.io_wepy_index.html]: https://tencent.github.io/wepy/index.html
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM2MjMyNjEx_size_16_color_FFFFFF_t_70]: /images/20210724/3245bf0b25954d779b88a02f0fd0e6b9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM2MjMyNjEx_size_16_color_FFFFFF_t_70 1]: /images/20210724/9d11f44aae73407db06fd1cb508cfc34.png