@1xinternet/editable-webpack-config 中文文档教程
Reusable build configuration for Drupal Editable JS libraries
该模块包含 Drupal 可编辑模块的 webpack 配置工厂函数。
它使用模块的 package.json 中的配置键和 NODE_ENV 标志来构建正确的 webpack 配置。
Example usage
(project package.json)
{
"scripts": {
"build": "npm run build:dev && npm run build:prod",
"build:dev": "NODE_ENV=development webpack --config ./node_modules/@1xinternet/editable-webpack-config",
"build:prod": "NODE_ENV=production webpack --config ./node_modules/@1xinternet/editable-webpack-config"
},
"config": {
"namespace": "MyCustomNameSpace",
"bundleName": "file_name_for_the_bundle",
"isEditableRoot": "false",
"externals": {
"EditableBaseComponents": "@1xinternet/editable-base-components"
}
}
}
代码入口在 ./src/index.js – bundle 文件将以 bundleName 命名并写入 < code>./dist/
externals 合并到 webpack 的外部配置中。 这些库在库中可能是必需的，但不会成为构建包的一部分。 它们应该在全局命名空间内可用。
isEditableRoot flag
只有根可编辑 JS 库需要此标志。 它可以将一些库暴露给全局命名空间。 依赖核心/根库的任何其他库都不需要这样做！ （只需删除此键）
Installation
webpack 配置需要安装一些库。 使用此命令安装它们：
npm i -D @babel/core @babel/plugin-proposal-class-properties @babel/plugin-syntax-export-default-from @babel/preset-env @babel/preset-react babel-loader react-dev-utils webpack webpack-cli
如果您从 babel 收到错误，这可能是由于模块依赖于旧版本的 babel-core。 要解决此问题，请尝试：
npm i -D babel-core@^7.0.0-bridge.0
Reusable build configuration for Drupal Editable JS libraries
This module contains webpack config factory function for Drupal Editable modules.
It uses the config key from the package.json of the module and the NODE_ENV flag to build the correct webpack configuration.
Example usage
(project package.json)
{
"scripts": {
"build": "npm run build:dev && npm run build:prod",
"build:dev": "NODE_ENV=development webpack --config ./node_modules/@1xinternet/editable-webpack-config",
"build:prod": "NODE_ENV=production webpack --config ./node_modules/@1xinternet/editable-webpack-config"
},
"config": {
"namespace": "MyCustomNameSpace",
"bundleName": "file_name_for_the_bundle",
"isEditableRoot": "false",
"externals": {
"EditableBaseComponents": "@1xinternet/editable-base-components"
}
}
}
Code entry is at ./src/index.js – bundle files will be named after bundleNameand written to ./dist/
externals is merged into the externals config of webpack. These libraries can be required in the library but will not be part of the built bundle. They are expected to be available within the global namespace.
isEditableRoot flag
This flag is only required for the root editable JS library. It enables exposing some libraries to the global namespace. This is not needed for any other libraries depending on the core/root library! (simply remove this key)
Installation
The webpack config requires some libraries to be installed. Install them with this command:
npm i -D @babel/core @babel/plugin-proposal-class-properties @babel/plugin-syntax-export-default-from @babel/preset-env @babel/preset-react babel-loader react-dev-utils webpack webpack-cli
If you get an error from babel, this might be due to modules depending on the old version of babel-core. To fix this, try:
npm i -D babel-core@^7.0.0-bridge.0
