Shulou(Shulou.com)06/01 Report--

This article mainly explains "what are the ways to build npm". The content in the article is simple and clear, and it is easy to learn and understand. Please follow the editor's train of thought to study and learn "what are the ways to build npm?"

Default way to build npm

By default, after package.json is correctly configured within miniprogramRoot and npm install is executed, the result of building npm is to build a miniprogram_npm for each package.json corresponding node_modules and place it in a subdirectory of the directory where the corresponding package.json resides. Reference demo

Before building npm

├── miniprogram

│ ├── app.js

│ ├── app.json

│ ├── app.wxss

│ ├── index

│ │ ├──

│ ├── node_modules / / can build npm by default because it is within miniprogramRoot

│ ├── package.json

│ └── sub_package

│ ├── node_modules / / can build npm by default because it is within miniprogramRoot

│ ├── package.json

│ └── sub_package_page

├── node_modules / / is not built npm by default because it is not in miniprogramRoot

├── package.json

└── project.config.json / / there is a configuration `"miniprogramRoot": ". / miniprogram"`

After building npm

├── miniprogram

│ ├── app.js

│ ├── app.json

│ ├── app.wxss

│ ├── index

│ │ ├──

│ ├── miniprogram_npm

│ ├── node_modules / / can be built by default because it is within the miniprogramRoot-- > the sibling miniprogram_npm is the result of this node_modules

│ ├── package.json

│ └── sub_package

│ ├── miniprogram_npm

│ ├── node_modules / / can be built by default because it is within the miniprogramRoot-- > the sibling miniprogram_npm is the result of this node_modules

│ ├── package.json

│ └── sub_package_page

├── node_modules / / is not built by default because it is not in miniprogramRoot-- > it does not have a corresponding miniprogram_npm generation

├── package.json

└── project.config.json / / there is a configuration `"miniprogramRoot": ". / miniprogram"`

Customize how to build npm for node_modules and miniprogram_npm locations

Unlike the "default way to build npm", this approach requires developers to specify the location of the mode_modules and the location of the target miniprogram_npm in the project.config.json. Reference demo

Method of use

Configure the setting.packNpmManually of project.config.json to true, and enable the construction npm of custom node_modules and miniprogram_npm locations.

Configure the setting.packNpmRelationList entry for project.config.json, specifying the location of packageJsonPath and miniprogramNpmDistDir

Where the format of packNpmRelationList is

PackageNpmRelationList: Array

PackageJsonPath represents the package.json corresponding to the node_modules source

MiniprogramNpmDistDir represents the target location of the build result of the node_modules

Before building npm

.

├── miniprogram

│ ├── app.js

│ ├── app.json

│ ├── app.wxss

│ ├── index

│ ├── sitemap.json

│ └── sub_package

│ └── sub_package_page

├── project.config.json

├── src_node_modules_1

│ ├── node_modules

│ └── package.json

└── src_node_modules_2

├── node_modules

└── package.json

Where project.config.json exists configuration

"setting": {

"packNpmManually": true

"packNpmRelationList": [

{

PackageJsonPath: ". / src_node_modules_1/package.json"

MiniprogramNpmDistDir: ". / miniprogram/"

}

{

PackageJsonPath: ". / src_node_modules_2/package.json"

MiniprogramNpmDistDir: ". / miniprogram/sub_package"

}

]

}

After building npm

.

├── miniprogram

│ ├── app.js

│ ├── app.json

│ ├── app.wxss

│ ├── index

│ ├── miniprogram_npm / / built by src_node_modules_1/node_modules

│ ├── sitemap.json

│ └── sub_package

│ ├── miniprogram_npm / / built by src_node_modules_2/node_modules

│ └── sub_package_page

├── project.config.json

├── src_node_modules_1

│ ├── node_modules

│ └── package.json

└── src_node_modules_2

├── node_modules

└── package.json

Thank you for your reading, the above is the content of "what are the ways to build npm". After the study of this article, I believe you have a deeper understanding of the way of building npm, and the specific use needs to be verified in practice. Here is, the editor will push for you more related knowledge points of the article, welcome to follow!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.