Question

业务问题：对于一系列Ember应用程序，允许CMS控制颜色，徽标和特定内容，以支持软件的白色/灰色标记。

建议的解决方案：将创建一个Ember CLI插件，在构建时，它会提取相应的样式表规则，徽标URL等，并将内容注入适当的树中。

插件的初始实现：

// index.js
/* jshint node: true */
'use strict';

const BroccoliMergeTrees = require('broccoli-merge-trees');
const broccoliSource = require('broccoli-source');
const UnwatchedDir = broccoliSource.UnwatchedDir;
const apiFactory = require('./lib/cms-integration-addon/api.js');
const writeFile = require('write');

module.exports = {
  name: 'cms-integration-addon',
  cmsIntegrationConfig: {},
  isDevelopingAddon() {
    return true;
  },

  included(app) {
    const config = app.project.config(app.env)['cms-integration'] || {};
    this.cmsIntegrationConfig = config;
  },

  treeForAddon() {
    let tree = this._super.treeForAddon.apply(this, arguments);

    const cmsDetailsSource = new UnwatchedDir(this.app.project.root + '/tmp/cms-integration-addon');
    tree = new BroccoliMergeTrees([tree, cmsDetailsSource]);

    return tree;
  },

  preBuild() {
    const cms = apiFactory(this.cmsIntegrationConfig);
    return cms.fetchSettings().then((settings) => {
      const configPath = `${this.app.project.root}/tmp/cms-integration-addon/config/my-config.js`;

      return writeFile(configPath, `export default ${JSON.stringify(settings)}`);
    });
  }
};

问题在于，使用此代码，来自CMS的相应JSON对象不会像我期望的那样插入vendor.js模块下的cms-integration-addon。然而，如果我将treeForAddon更改为treeForApp，则设置对象会插入应用程序模块下的app-name.js。这不是理想的，如果这个代码是在插件模块下注入的话会更好。

我错过了能够将我的JSON对象注入插件模块的内容吗？

Answer 1

虽然我无法确定为什么treeForApp允许注入，但其他treeFor*方法没有，我能够确定如何在构建时将代码适当地插入到插件中。使用上面的示例，需要进行一些更改，并在app.import()中添加新的ember-cli-build.js调用。

将JSON对象的输出路径更改为vendor/而不是tmp/。根据{{3}}，只有bower_components和vendor下的文件才能导入您的应用。
使用vendor/将实际文件输出更改为define()目录以符合AMD格式。
将以下行添加到ember-cli-build.js文件中：

app.import('vendor/cms-integration/config/my-config.js');

此时您应该看到将相应的对象注入到vendor.js文件中，您可以通过调用它来使用它：

import CmsSettings from 'cms-integration/config/my-config';

Ember CLI使用自定义CMS设置构建

1 个答案: