The mPaaS Mini Program natively supports the introduction of third-party npm modules. Therefore, custom components can be published to npm, which facilitates the developers to reuse and share.
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.acssJSON 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.js
const fs = require('fs-extra');
const path = require('path');
// copy file
fs.copySync(path.join(__dirname, '../src'), path.join(__dirname, '../es'), {
filter(src, des){
return !src.endsWith('.js');
}
});// scripts/rm.js
const fs = require('fs-extra');
const path = require('path');
// remove unnecessary file
const 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/'));该文章对您有帮助吗?