Code Monkey home page Code Monkey logo

gulp-wechat-miniprogram's Introduction

gulp-wechat-miniprogram

基于gulp构建的微信小程序开发流

特性

  • 支持所有原生语法特性
  • 支持小程序npm
  • 支持Typescript(引入miniprogram-api-typings小程序声明文件)
  • 支持Scss, Sass
  • 支持样式补全
  • 支持Eslint
  • 支持Stylelint
  • 命令行一键创建page和component目录(wxml, ts, wxss, json文件)
  • watch热更新
  • cli脚手架

目标

  • 监听文件删除
  • 路径�alias别名(@page, @com, @utils, @config...)

开始使用

  1. 安装本项目的脚手架: mp-cli

  2. 开始, 生成dist目录, 用微信开发者工具打开dist目录

    npm run start
    yarn start

添加小程序npm支持

  1. ��以dayjs, lodash示例, 执行以下命令(支持多个npm同时安装)

    yarn add_npm dayjs lodash
  2. 重新启动项目

    yarn start
    yarn start
  3. 点击开发者工具 - 工具 - 构建npm完成构建并使用

    • js 中引入 npm 包:

      const dayjs = require('dayjs')
      const _ = require('lodash')
    • ts 中引入 npm 包:

      import dayjs from 'dayjs'
      import _ from 'lodash'
    • 使用 npm 包中的自定义组件:

      {
        "usingComponents": {
          "myPackage": "packageName",
          "package-other": "packageName/other"
        }
      }

说明

  • wxs模块

    在app/modules目录内的ts文件将编译成.wxs模块, 模块规范使用CommonJS标准(即使用module.exports导出), 在wxml内直接引用模块

      <wxs src="./modules/tools.wxs" module="tools" />
  • template模板

    虽然不受限, 但建议放置在app/templates目录内

gulp-wechat-miniprogram's People

Contributors

caicoleung avatar lin-ya avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Forkers

sandmanman lin-ya

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.