Ember CLI 사용자 정의 CMS 설정으로 빌드

비즈니스 문제 : 일련의 Ember 응용 프로그램의 경우 소프트웨어의 흰색/회색 레이블링을 지원하기 위해 CMS에서 색상, 로고 및 특정 내용을 제어 할 수 있습니다.Ember CLI 사용자 정의 CMS 설정으로 빌드

제안 된 솔루션 : 빌드시에 적절한 스타일 시트 규칙, 로고 URL 등을 가져 와서 해당 트리에 내용을 주입하는 Ember CLI 애드온이 생성됩니다. 부가 기능에 대한

초기 구현 :

// 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 객체가 cms-integration-addon 모듈에서 vendor.js에 삽입되지 않는다는 것입니다. 그러나 일 경우 treeForAddon에서 treeForApp으로 변경하면 설정 개체가 앱 모듈 아래 app-name.js에 삽입됩니다. 이상적인 것은 아니며이 코드를 애드온 모듈에 삽입하면 더 좋습니다.

내 JSON 개체를 애드온 모듈에 삽입하려면 무엇이 누락 되었습니까?

출처

2017-09-12 cspray

treeForApp이 허용되는 이유를 알 수 없었지만 다른 treeFor* 메서드는 내가 빌드 타임에 애드온에 코드를 주입하는 방법을 결정할 수 없었습니다. 위의 예를 사용하면 ember-cli-build.js에 새로운 app.import() 호출을 추가 할 때 몇 가지 사항을 변경해야합니다. json으로 개체의 출력 경로

변경 vendor/ 대신 tmp/에서 살고 있습니다. Ember CLI documentation에 따르면 bower_components 및 vendor 아래에있는 파일 만 앱에 가져올 수 있습니다.
define()을 사용하여 AMD 형식을 준수하도록 실제 파일 출력을 vendor/ 디렉토리로 변경하십시오.
은 ember-cli-build.js 파일에 다음 줄을 추가합니다 :

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

을 적절한 대상이 vendor.js 파일에 주입하고 호출하여 사용할 수 있습니다 볼 수이 시점에서 :

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

출처

2017-09-14 17:17:23 cspray

Ember CLI 사용자 정의 CMS 설정으로 빌드

답변

관련 문제