feat: 插件支持 onAppConfig 和 onPageConfig hook

docs/guide/advanced/plugin.md

@@ -53,6 +53,48 @@ export default options => {
 
 ## Hooks
 
+### onAppConfig
+
+修改应用配置，注意跟运行时 hook `onAppConfig` 的区别，这个 hook 修改的是 `app.json`。
+
+#### 参数
+
+- `params`
+  -  `config` - `app.json` 配置。
+
+```js
+{
+  onAppConfig({ config }) {
+    config.window = {
+      ...config.window,
+      defaultTitle: "Hello",
+    }
+    return config;
+  }
+}
+```
+
+### onPageConfig
+
+修改页面配置，注意跟运行时 hook `onPageConfig` 的区别，这个 hook 修改的是页面对应的 json 配置。
+
+#### 参数
+
+- `params`
+  - `page` - 页面路径，如: `pages/home/index`。
+  - `config` - 页面配置。
+
+```js
+{
+  onPageConfig({ config, page }) {
+    if (page === 'pages/home/index') {
+      config.defaultTitle = 'Home page';
+    }
+    return config;
+  }
+}
+```
+
 ### configWebpack
 
 修改 Webpack 配置。
@@ -75,6 +117,7 @@ export default options => {
 {
   configBabel({ config }) {
     config.plugins.push('awesome-babel-plugin');
+    return config;
   }
 }
 ```
@@ -97,9 +140,14 @@ export default options => {
 
 修改 App 的配置。
 
+#### 参数
+
+- `params`
+  - `config` - Remax 生成的 App 配置。
+
 ```js
 {
-  onAppConfig(config) {
+  onAppConfig({ config }) {
     const onLaunch = config.onLaunch;
     config.onLaunch = () => {
       console.log('onLaunch');
@@ -116,6 +164,11 @@ export default options => {
 
 修改 Page 的配置。
 
+#### 参数
+
+- `params`
+  - `config` - Remax 生成的 Page 配置。
+
 ```js
 {
   onPageConfig(config) {

packages/remax-ali/src/node/index.ts

@@ -7,7 +7,6 @@ const TPL_STATIC_ROOT = path.join(__dirname, '../../templates', 'static');
 
 const plugin: PluginConstructor = () => {
   return {
-    name: 'remax-ali',
     meta: {
       global: 'my',
       template: {

packages/remax-cli/src/API.ts

@@ -1,6 +1,6 @@
 import { hostComponents } from '@remax/macro';
 import * as t from '@babel/types';
-import { Options, Plugin, Meta, HostComponent, Platform } from '@remax/types';
+import { Plugin, Meta, HostComponent, Platform } from '@remax/types';
 import { merge } from 'lodash';
 import Config from 'webpack-chain';
 import { RuleConfig } from './build/webpack/config/css';
@@ -93,6 +93,24 @@ export default class API {
     }, true);
   }
 
+  onAppConfig(config: any) {
+    return this.plugins.reduce((acc, plugin) => {
+      if (typeof plugin.onAppConfig === 'function') {
+        acc = plugin.onAppConfig({ config: acc });
+      }
+      return acc;
+    }, config);
+  }
+
+  onPageConfig({ page, config }: { page: string; config: any }) {
+    return this.plugins.reduce((acc, plugin) => {
+      if (typeof plugin.onPageConfig === 'function') {
+        acc = plugin.onPageConfig({ page, config: acc });
+      }
+      return acc;
+    }, config);
+  }
+
   configWebpack(params: { config: Config; webpack: any; addCSSRule: (ruleConfig: RuleConfig) => void }) {
     this.plugins.forEach(plugin => {
       if (typeof plugin.configWebpack === 'function') {
@@ -119,9 +137,8 @@ export default class API {
       .filter(Boolean);
   }
 
-  public registerAdapterPlugins(targetName: Platform, remaxConfig: Options) {
+  public registerAdapterPlugins(targetName: Platform, one = false) {
     this.adapter.target = targetName;
-    this.adapter.name = targetName;
     this.adapter.packageName = '@remax/' + targetName;
 
     const packagePath = this.adapter.packageName + '/node';
@@ -131,7 +148,7 @@ export default class API {
     this.registerHostComponents(plugin.hostComponents);
     this.plugins.push(plugin);
 
-    if (remaxConfig.one) {
+    if (one) {
       const onePath = '@remax/one/node';
 
       const plugin = require(onePath).default || require(onePath);
@@ -141,8 +158,8 @@ export default class API {
     }
   }
 
-  public registerPlugins(options: Options) {
-    options.plugins?.forEach(plugin => {
+  public registerPlugins(plugins: Plugin[]) {
+    plugins?.forEach(plugin => {
       if (plugin) {
         this.registerHostComponents(plugin.hostComponents);
         this.plugins.push(plugin);

packages/remax-cli/src/__tests__/API.test.ts

@@ -2,14 +2,11 @@ import API from '../API';
 import { Platform, Plugin } from '@remax/types';
 
 function entries(): Plugin {
-  return {
-    name: 'entries',
-  };
+  return {};
 }
 
 function props1(): Plugin {
   return {
-    name: 'props1',
     processProps({ props }) {
       return [...props, 'p1'];
     },
@@ -18,7 +15,6 @@ function props1(): Plugin {
 
 function props2(): Plugin {
   return {
-    name: 'props2',
     processProps({ props }) {
       return [...props, 'p2'];
     },
@@ -29,19 +25,15 @@ describe('api', () => {
   const api = new API();
 
   beforeAll(() => {
-    const options: any = {
-      plugins: [entries(), props1(), props2()],
-    };
-    api.registerPlugins(options);
-    api.registerAdapterPlugins(Platform.ali, options);
+    api.registerPlugins([entries(), props1(), props2()]);
+    api.registerAdapterPlugins(Platform.ali, false);
   });
 
   it('install plugins in a variety of ways', () => {
     expect(api.plugins).toHaveLength(4);
   });
 
   it('install adapter plugin', () => {
-    expect(api.adapter.name).toEqual('ali');
     expect(api.adapter.target).toEqual('ali');
     expect(api.adapter.packageName).toEqual('@remax/ali');
   });
@@ -79,4 +71,51 @@ describe('api', () => {
       }
     `);
   });
+
+  it('onAppConfig', () => {
+    api.registerPlugins([
+      {
+        onAppConfig({ config }) {
+          config.window = {
+            ...config.window,
+            defaultTitle: 'hello,',
+          };
+          return config;
+        },
+      },
+    ]);
+
+    expect(api.onAppConfig({})).toEqual({
+      window: {
+        defaultTitle: 'hello,',
+      },
+    });
+  });
+
+  it('onPageConfig', () => {
+    api.registerPlugins([
+      {
+        onPageConfig({ page, config }) {
+          if (page === 'pages/home/index') {
+            config.defaultTitle = 'home';
+          }
+          return config;
+        },
+      },
+    ]);
+
+    expect(
+      api.onPageConfig({
+        page: 'pages/index/index',
+        config: {},
+      })
+    ).toEqual({});
+
+    expect(
+      api.onPageConfig({
+        page: 'pages/home/index',
+        config: {},
+      })
+    ).toEqual({ defaultTitle: 'home' });
+  });
 });

packages/remax-cli/src/__tests__/integration/fixtures/hook-onAppConfig/expected/app.js

@@ -0,0 +1,80 @@
+require('./runtime.js');
+(my["webpackJsonp"] = my["webpackJsonp"] || []).push([[1],[
+/* 0 */
+/***/ (function(module, exports, __webpack_require__) {
+
+module.exports = __webpack_require__(1);
+
+
+/***/ }),
+/* 1 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _remax_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2);
+/* harmony import */ var _remax_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_remax_runtime__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(3);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function () { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+
+
+
+var _App = /*#__PURE__*/function (_React$Component) {
+  _inherits(_App, _React$Component);
+
+  var _super = _createSuper(_App);
+
+  function _App() {
+    _classCallCheck(this, _App);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(_App, [{
+    key: "render",
+    value: function render() {
+      return this.props.children;
+    }
+  }]);
+
+  return _App;
+}(react__WEBPACK_IMPORTED_MODULE_1__["Component"]);
+
+/* harmony default export */ __webpack_exports__["default"] = (App(Object(_remax_runtime__WEBPACK_IMPORTED_MODULE_0__["createAppConfig"])(_App)));
+
+/***/ }),
+/* 2 */
+/***/ (function(module, exports) {
+
+module.exports = require("@remax/runtime");
+
+/***/ }),
+/* 3 */
+/***/ (function(module, exports) {
+
+module.exports = require("react");
+
+/***/ })
+],[[0,0]]]);

packages/remax-cli/src/__tests__/integration/fixtures/hook-onAppConfig/expected/app.json

@@ -0,0 +1,5 @@
+{
+  "pages": [
+    "pages/index"
+  ]
+}