Giter Club home page Giter Club logo

weapp-boilerplate's Introduction

微信小程序骨架

一个为微信小程序开发准备的基础骨架

Build Status Dependency Status devDependency Status js-standard-style

For English

English

骨架特点

  • 开发阶段与生产阶段分离。
  • 自动化生成新页面所需文件并添加到配置中。
  • Standard Code Style校验全部的jsjson文件。
  • 开发阶段json配置文件可以有注释,方便备注。
  • 代码中集成部分文档内容,减少查文档的时间。
  • 开发阶段可以使用less完成样式编码,原因你懂得~ (如果你了解这些,当然可以支持sass等其他预处理样式)。
  • 借助babel自动进行ES2015特性转换,放心使用新特性。
  • 开发阶段用xml文件后缀取代wxml后缀,避免在开发工具中配置代码高亮。
  • Source Map
  • Travis CI

将项目克隆到本地

# 定位到任意目录
$ cd path/to/root

# 克隆仓库到指定的文件夹
$ git clone https://github.com/zce/weapp-boilerplate.git [project-name] --depth 1

# 进入指定的文件夹
$ cd [project-name]

安装项目NPM依赖

$ npm install

使用

开发阶段

执行如下命令

# 启动监视
$ npm run watch

通过微信Web开放者工具打开项目根目录下dist文件夹,预览~

可以通过任意开发工具完成src下的编码,gulp会监视项目根目录下src文件夹,当文件变化自动编译

创建新页面

执行如下命令

# 启动生成器
$ npm run generate
# 完成每一个问题
# 自动生成...

由于微信小程序的每一个页面有特定的结构,新建工作比较繁琐。可以通过此任务减少操作。

生产阶段

执行如下命令

# 启动编译
$ npm run build

生产阶段的代码会经过压缩处理,最终输出到dist下。

同样可以通过微信Web开放者工具测试。

开发计划

  • 自动化生成新页面所需文件;
  • 自动生成新页面时,自动添加配置到app.json
  • 加入ES2015Polyfill,支持类似Promise的新API
  • 自动刷新微信Web开放者工具中的预览;
  • HTML to WXML 转换器,让大家可以直接使用HTML元素开发;

相关项目

zce/weapp-demo

有问题?

Welcome PR or Issue!

许可

MIT © 汪磊

weapp-boilerplate's People

Contributors

zce avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

weapp-boilerplate's Issues

项目烂尾了?

之前项目用小程序原生方式开发的,做的时候就挺想要这么一个脚手架,找了好久没找到,自己又没配置好。无意间浏览到此库,看上去停了4年没再继续,有点可惜呀。

怎么引入第三方库?

请问怎么在page的js中引入第三方库? 我现在的写法及报错如下。
import { html2json } from '../../html2json'

image

npm用的啥版本?

node.js好像在cygwin下不能正常使用, 你用的是啥版本的node.js以及npm?

是不是缺少依赖啊?我npm run watch后有报错

报错如下:有好几个模块都说找不到,一个个安装又太麻烦了。对前端库不是很熟悉,需要修改什么吗?
`james weapp-boilerplate # npm run watch

[email protected] watch /home/james/code/hello-world/code/weixin/weapp-boilerplate
gulp watch

[15:24:47] Using gulpfile /home/james/code/hello-world/code/weixin/weapp-boilerplate/gulpfile.js
[15:24:47] Starting 'lint'...
[15:24:48] Finished 'lint' after 1.14 s
[15:24:48] Starting 'build'...
[15:24:48] Starting 'clean'...
[15:24:48] Starting 'extras'...
[15:24:48] Finished 'clean' after 15 ms
[15:24:48] Starting 'compile'...
[15:24:48] Starting 'compile:js'...
[15:24:49] 'compile:js' errored after 801 ms
[15:24:49] Error: Cannot find module 'babel-generator'
at Function.Module._resolveFilename (module.js:325:15)
at Function.Module._load (module.js:276:25)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object. (/home/james/code/hello-world/code/weixin/weapp-boilerplate/node_modules/.6.23.1@babel-core/lib/transformation/file/index.js:62:23)
at Module._compile (module.js:409:26)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
[15:24:49] 'build' errored after 820 ms
[15:24:49] Error in plugin 'run-sequence(compile:js)'
Message:
Cannot find module 'babel-generator'
`

npm run build ,i met following error,how can i resovel this?

events.js:160
throw er; // Unhandled 'error' event
^
Error:

at notFoundError (D:\localbird\weapp-boilerplate\node_modules\execa\node_mo

\enoent.js:11:11)
at verifyENOENT (D:\localbird\weapp-boilerplate\node_modules\execa\node_mod
enoent.js:46:16)
at ChildProcess.cp.emit (D:\localbird\weapp-boilerplate\node_modules\execa
awn\lib\enoent.js:33:19)
at Process.ChildProcess._handle.onexit (internal/child_process.js:215:12)

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.