Git Product home page Git Product logo

broccoli-file-manifest's People

Contributors

dependabot[bot] avatar joankaradimov avatar webark avatar

Stargazers

 avatar  avatar

Watchers

 avatar  avatar

broccoli-file-manifest's Issues

Tests?

Would be really helpful to see/understand what is going on here if there were some tests.

I would suggest using broccoli-test-helper, which would let you do something like (pseudo code):

it("should build", async function() {
    input.write({
      "src": {
        "ui": {
          "components": {
            "todo-item": {
              "style.scss": '/* todo item styles */'
            },
            "other-thing": {
              "style.scss": '/* other thing styles */'
            }
          }
        }
      }
    });

    await output.build();

    expect(output.read()).to.deep.equal({
      "src": {
        "ui": {
          "styles": {
            "app.scss": stripIndent`
              @import "src/ui/components/todo-item/style";
              @import "src/ui/components/other-thing/style";`
          },
          "components": {
            "todo-item": {
              "style.scss": '/* todo item styles */'
            },
            "other-thing": {
              "style.scss": '/* other thing styles */'
            }
          }
        }
      }
    });
});

Make this project an ember-cli also?

I believe making this project an ember-cli addon would basically require the following steps:

  • add the following to package.json:
{
  // snip ....
  "keywords": [
    // existing keywords?
    "ember-addon"
  ],
  "ember-addon": {
    "main": "ember-addon-index.js"
  }
}
  • add an ember-addon-index.js file with the following contents:
const MergeTrees = require('broccoli-merge-trees');
const StyleManifest = require('broccoli-style-manifest');

module.exports = {
  name: 'broccoli-style-manifest',

  preprocessTree(type, tree) {
    if (type === 'src') {
      return new MergeTrees([tree, new StyleManifest(tree, {
        outputFileNameWithoutExtension: 'src/ui/styles/app'
      })], { overwrite: true });
    }
  }
};
  • profit?

Doing the above would enable folks to opt-in to colocated styles in glimmer apps (and ultimately ember apps with module unification layout) via:

ember new my-app -b @glimmer/blueprint
cd my-app
ember install broccoli-style-manifest

Handle when output file already exists.

Imagine a scenario where you have some shared styles, that you keep in src/ui/app.scss, but still want to support adding @import "all/other/files".

I believe currently, this plugin will always clobber the output file if it is already present. IMHO, that is a bug, we should either just add to the file or throw a very loud error ๐Ÿ˜ˆ ...

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.