This would probably help in development while we're waiting on #2 to be possible. A minify: false option or something like that with the default being true.

For example, if my file structure is like this:

/composer.json 
/content/themes/my-theme/compile.json
/content/themes/my-theme/scss/style.scss

and my compile.json file looks like this:

{
  "compile": {
    "css": {
      "style.css": "scss/style.scss"
    }
  }
}

and my style.scss file looks like this:

.my-div {
  background: url('img/background.svg');
}

and I run FEC from the root of my project like so:

vendor/bin/fec --path content/themes/my-theme/compile.json

the path in my CSS gets changed to:

../../../img/background.svg

Ideally, the path wouldn't get changed so it ends up relative to where style.css gets created.

For now you can get around this by making your CSS url paths relative to wherever you'll be running FEC from. So in my case here, I would use content/themes/my-theme/img/background.svg.

We use the --compress option to make sure any comments or newline characters are removed from vendor libraries to make sure our production CSS and JavaScript is as small as possible (some work could still be done on the JS side of things), however with WordPress themes, we need the first comment block to be preserved for it's metadata.

I'm thinking something like this:

{
  "settings": {
    "fec": {
      "compress": "!sass/style.scss"
    }
  }
}

But I'm not 100% sure yet.

We currently output the main scss files as well as any css and JavaScript files that are loaded in. It would probably be nice to also get a list of any additional files that are loaded in via scss and compiled.

The scssphp library we're using does have the the ability to hook into the import function as documented here: https://scssphp.github.io/scssphp/docs/extending/importers.html I've played with it a little bit but didn't get very far, however I do think it's possible.

This command would start a task that watches for any changes to source files and recompile them when needed.

fec watch

It would also be nice to have this command inject some JavaScript or something where the page would automatically refresh when files are recompiled but that would probably be a lot more work.

Just like this issue I opened up on the GPM package: https://github.com/itsahappymedium/gpm/issues/2 I think it would be nice to be able to set options via the JSON file. Something like:

{
  "settings": {
    "fec": {
      "compress": true,
      "scss-import-path": "content/gpm_modules"
    }
  },
  "dependencies": {
     "derek-watson/jsuri": "1.3.1",
     "eduardoboucas/include-media": "1.4.10"
  }
}

Options could be overwritten via the CLI and paths would be relative to the JSON file.

Using FEC in combination with GPM on a project, like we have many times before, we ran into this weird edge-case where style.scss gets injected into the middle of imports.scss when it should have been at the top.

style.scss has only a multiline important comment and imports.scss has imports to other scss files that actually contain code.

{
  "compile": {
    "css": {
      "style.css": [
        "sass/style.scss",
        "sass/imports.scss"
      ]
    }
  },
  "settings": {
    "fec": {
      "remove-important-comments": "!sass/style.scss"
    }
  }
}

Removing remove-important-comments from the config fixes the issue. We have use this same exact setup on many other sites before and as far as I know this is the only time we've ran into this issue.

For example, I have two SCSS files that will be in their own separate destination files but they both import the same SCSS file. If I'm running the watch command and edit that imported SCSS file, only one of the destination files will get recompiled.

We currently use minify for minifying files which works pretty good but there are some improvements that could be made.

For example with CSS, it adds each file onto a new line, which we fix in FEC with some additional regex that's applied after minification happens, so not ideal, but that works fine.

But with JavaScript, not only does it add each file onto a new line, it preserves a lot of unnecessary line breaks and also doesn't mangle the variable names (which would be a nice option). The UglifyJS Node module does an awesome job at this but the point of FEC is to do it all in PHP.

We're kind of limited in PHP minification libraries and I wouldn't be against having a separate library for minifying JS. I've tried out JShrink as well as js-minify however both of them have a lot of the same issues that the minify package has and also failed to pass some of our project tests.

So for now, I think the minify package is about as good as it gets as far as PHP minification libraries go. One option would be to use an executable CLI minification application and call it from FEC. If we went that route though I'd probably want to add it in as an option that's disabled by default. I also don't know how I feel about including a third-party executable in the FEC repo but we could possibly have it downloaded as a composer post-install script.

I think the third-party executable is something I'll look into in the future but for now, we'll just stick with the minify package. I may look into submitting some pull requests to minify in the meantime.

It appears that the scssphp package has this feature but minify does not which might make this kind of difficult. However, I'm not against switching to a different minification package as I'm not 100% happy with how the current one handles JavaScript minification.