MorJS 多端適配輸出目錄結(jié)構(gòu)說明

這里主要是闡述輸出目錄，整體的 NPM 組件 說明，請參考下面的組件示例說明環(huán)節(jié)

exmaple-component 的 package.json 配置示例

{
  "name": "exmaple-component",

  // 缺省目錄設(shè)置，JS 入口文件為 lib/index.js，
  // 未指定端的小程序組件文件會從該目錄下獲取，
  // 如將該字段配置為 "lib/index.js", 則有可能會
  // 無法找到正確的組件文件
  "main": "lib",

  // 微信小程序的入口配置，請注意，只需要配置目錄名即可
  "miniprogram": "miniprogram_dist",

  // 支付寶小程序的入口配置，請注意，只需要配置目錄名即可
  "alipay": "alipay",

  // 建議配置只輸出組件內(nèi)容目錄
  "files": [
    "lib",
    "miniprogram_dist",
    "alipay"
  ]
}

exmaple-component 的整體輸出目錄結(jié)構(gòu)示例

- lib
  - index.js
  - index.axml
  - index.acss
  - index.json
- miniprogram_dist
  - lib
    - index.js
    - index.wxml
    - index.wxss
    - index.json
- alipay
  - lib
    - index.js
    - index.wxml
    - index.wxss
    - index.json
- package.json

請注意: miniprogram_dist 和 alipay 目錄下是有 lib 目錄的！

使用方引用 NPM 組件 示例

{
  "usingComponents": {
    "demo-component": "exmaple-component/lib/index"
  }
}

MorJS 編譯說明?

默認情況下，使用方引用組件 exmaple-component 去掉多端專屬的那個目錄就可以了。在不同端下 MorJS 會根據(jù)組件的 package.json 中的相關(guān)入口字段，如 miniprogram 字段來自動匹配加上對應(yīng)的路徑，來確保使用方只需一個引用路徑，即可在多個端上生效。