The mPaaS Mini Program natively supports the introduction of third-party npm modules. Therefore, custom components can be published to npm, which facilitates code reuse and sharing.
Recommended custom component directory for releasing
The following directory structure is for reference only.
File structure
├── src // The file path of a single custom component│ ├── index.js│ ├── index.json│ ├── index.axml│ ├── index.acss│ └── demo // A demonstration of the custom component│ ├── index.js│ ├── index.json│ ├── index.axml│ └── index.acss├── app.js // A demonstration of the custom component in a Mini Program├── app.json└── app.acss
JSON file sample
// package.json{"name": "your-custom-compnent","version": "1.0.0","description": "your-custom-compnent","repository": {"type": "git","url": "your-custom-compnent-repository-url"},"files": ["es"],"keywords": ["custom-component","mini-program"],"devDependencies": {"rc-tools": "6.x"},"scripts": {"build": "rc-tools run compile && node scripts/cp.js && node scripts/rm.js","pub": "git push origin && npm run build && npm publish"}}
js file sample
// scripts/cp.jsconst fs = require('fs-extra');const path = require('path');// copy filefs.copySync(path.join(__dirname, '../src'), path.join(__dirname, '../es'), {filter(src, des){return !src.endsWith('.js');}});
// scripts/rm.jsconst fs = require('fs-extra');const path = require('path');// remove unnecessary fileconst dirs = fs.readdirSync(path.join(__dirname, '../es'));dirs.forEach((item) => {if (item.includes('app.') || item.includes('DS_Store') || item.includes('demo')) {fs.removeSync(path.join(__dirname, '../es/', item));} else {const moduleDirs = fs.readdirSync(path.join(__dirname, '../es/', item));moduleDirs.forEach((item2) => {if (item2.includes('demo')) {fs.removeSync(path.join(__dirname, '../es/', item, item2));}});}});fs.removeSync(path.join(__dirname, '../lib/'));