3

Brunch でSugarSS パーサーを使い始めるにはどうすればよいですか?

pluginsこれが私の現在の設定の一部です:

exports.config = {

  ...

  plugins: {
    babel: {
      ignore: [/web\/static\/vendor/]
    },
    postcss: {
      processors: [
        require("postcss-cssnext")(["last 3 versions"]),
        require("precss"),
        require("lost")
      ]
    },
    cssnano: {
      autoprefixer: {
        add: false
      }
    }
  }

  ...

};

そして私のpackage.json

{
  "repository": {},
  "dependencies": {
    "babel-brunch": "~6.0.0",
    "brunch": "~2.1.3",
    "css-brunch": "~1.7.0",
    "cssnano": "^3.5.2",
    "cssnano-brunch": "^1.1.5",
    "javascript-brunch": "~1.8.0",
    "lost": "^6.7.2",
    "phoenix": "file:deps/phoenix",
    "phoenix_html": "file:deps/phoenix_html",
    "postcss-brunch": "^0.5.0",
    "postcss-cssnext": "^2.5.1",
    "postcss-scss": "^0.1.7",
    "precss": "^1.4.0",
    "sugarss": "^0.1.2",
    "uglify-js-brunch": "~1.7.0"
  }
}
4

1 に答える 1

2

ブランチ用の PostCSS プラグインの仕組みは、すべてのスタイルシートがコンパイルされて 1 つのファイルに連結された後に呼び出されることです。(Brunch はそれをオプティマイザプラグインと呼んでいます)

ただし、SugarSS などのサポートには、sss を通常の css に変換するだけのカスタムコンパイラプラグインを作成する必要があります。

実際は思ったより簡単です :) plugins.mdをプラグイン API リファレンスとして使用します。役立つ場合は、https://github.com/brunch/stylus-brunch/blob/master/index.jsstylus-brunchをご覧ください。

基本的に変更する必要があるのは次のとおりです。

  1. compile()メソッド、SugarSS パーサーで PostCSS を呼び出し、少なくともdataキー (この場合は文字列 css になります)を持つオブジェクトに解決される promise を返します。

  2. この場合prototype.extension、処理したい拡張機能に変更しますsss

  3. おそらくスタイラスconstructor()は必要なく、css モジュールのサポートも必要ないかもしれません

  4. これをリリースして、Brunch で SugarSS を使用しようとしている他の人が自分でこれを行う必要がないようにすることができます。共有は思いやりですよね?:)

    (そのルートに行く場合は、ブランチプラグインに のような接尾辞を付けて名前を付けるのが通例sugarss-brunchです。その後、プラグインのリストに含めることもできます/plugins.json )

これで問題が少し解決することを願っています。問題が発生した場合は、そこにコメントするか、GitHub http://github.com/brunch/brunchで問題を開いてください。

于 2016-04-19T10:53:12.223 に答える