Coder Social home page Coder Social logo

miniapps's Introduction

miniapps

小程序项目脚手架工具

如何安装

npm i miniapps -g

依赖: Node.js and Git.

功能

miniapp -h

创建小程序项目

执行 init 命令后,可以看到 目录中生成 srcdist 两个文件夹,其中 src 为源码目录,dist目录为编译 src 后生成的目录。dist 目录可用来在小程序开发者工具中打开。

$ miniapp init <project-name>

Example:

$ miniapp init miniapp-demo

编译

首先,先进入执行初始化命令时指定的目录,然后执行 miniapp buildsrc目录内的文件进行编译。miniapp 会根据文件后缀自动进行相应编译,目前支持 sass -> wxssstylus-wxssES6 -> ES5 的编译,编译后的文件在 dist 目录中。

$ cd miniapp-demo
$ miniapp build

监视文件改动

--watch-w 选项可以让我们在文件发生改动时自动重新编译。

$ cd miniapp-demo
$ miniapp build -w

快速生成 page 目录:

该命令可以快速生成符合微信小程序官方规范的目录结构,并且将新页面自动注册到 app.json 文件中

$ miniapp gen <page_name>

示例:

$ cd miniapp-demo
$ miniapp gen auth

以上命令执行后会自动在 src/pagesdist/pages 目录中生成 auth 文件夹:

 └─┬ src
      ├─┬ pages          
      │ ├── auth                
      │ │ ├── auth.js
      │ │ ├── auth.json
      │ │ ├── auth.wxml
      │ │ ├── auth.sass
      ...
 └─┬ dist
      ├─┬ pages          
      │ ├── auth                
      │ │ ├── auth.js
      │ │ ├── auth.json
      │ │ ├── auth.wxml
      │ │ ├── auth.wxss
      ...

安装组件:

除了使用 miniapp gen 来快速生成 page 结构,我们还可以使用 miniapp install 来从 git 安装指定页面,目前所有模块都将在 https://github.com/miniapps-team/ 该项目下获取。

$ miniapp i <widget_name>

示例:

$ cd miniapp-demo
$ miniapp i login

以上命令执行后,会依次执行以下步骤:

  1. 从 repo https://github.com/miniapps-team/minapp-widget-login.git 下载。
  2. 拷贝 minapp-widget-login repo 中的组件到 src/pagesdist/pages 下。

License

MIT

miniapps's People

Contributors

zhangyaochun avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.