最近個人でM1 Macbook Airを購入しました。自宅にはMac book Airが2つがあるのですが、相当ボロくなってしまったので、メルカリで打っても2,3万しかなりませんでした。なので、2013モデルはWindows10にBootCampにして、2015年モデルは実家に置くことにしました。奥さんには自分が使っていたMacBook Core M7 2016年モデルをあげました。古臭くなったMacはWindows化して、検証機器として利用できますので非常にオススメです。

さて、M1 Macを触り始めてからIntelのMacを使いたくなくなってしまう..というなんともパフォーマンスがよく、目からウロコが出てしまうマシンであると感じました。またARMアーキテクチャのCPUを採用しているため、開発環境はいくつか対応をする必要があります。

そこで個人開発をしている「famii」がDockerで問題なく動作するのか試してみましたが、yarn installができなくなってしまったのでその対処法をブログします。


error node-sass: Command failed.

  • docker-compose

  • yarn install

  • yarn build

  • package.json

https://sass-lang.com/blog/libsass-is-deprecated

After much discussion among the Sass core team, we’ve come to the conclusion that it’s time to officially declare that LibSass and the packages built on top of it, including Node Sass, are deprecated. For several years now, it’s been clear that there’s simply not enough engineering bandwidth behind LibSass to keep it up-to-date with the latest developments in the Sass language (for example, the most recent new language feature was added in November 2018). As much as we’ve hoped to see this pattern turn around, even the excellent work of long-time LibSass contributors Michael Mifsud and Marcel Greter couldn’t keep up with the fast pace of language development in both CSS and Sass.

・We no longer recommend LibSass for new Sass projects. Use Dart Sass instead.

・We recommend all existing LibSass users make plans to eventually move onto Dart Sass, and that all Sass libraries make plans to eventually drop support for LibSass.

・We’re no longer planning to add any new features to LibSass, including compatibility with new CSS features.

・LibSass and Node Sass will continue to be maintained indefinitely on a best-effort basis, including fixing major bugs and security issues and maintaining compatibility with the latest Node versions.

調べてみるとLibSass(node-sass)はCSSとSassの両方での言語開発の速いペースに追いつくことができなかったのと、今後はDart Sassを変わりに使ってくれとのことでした。なので、M1というよりもIntelだろうが関係ないので、Dart Sassに移行しなければなりませんね。

ちなみにフロントエンドはBootStrapでgulpで圧縮しています。そしてnode-sassはpackage.jsonの中でgulp-sassに依存しています。まずこれを削除するところからになります。


準備と対応

  • yarn.lockを削除
  • package.jsonからgulp-sassを削除

  • gulpfile.jsからgulp-sassをgulp-dart-sassに変更

  • gulp-dart-sassをインストール

  • package.jsonにgulp-dart-sassが追加されていることを確認

  • yarn install


    Dart Sassになって変わったところは?

    backgroud-imageを使う際は改行ではなくワンライナーにしないとエラーが出ることがわかりました。それ以外は問題なかったので、この機会に yarn upgrade --latest でバージョンアップして完了です。


    まとめ

    M1 Macでも動作できるようになりましたが、初心者で「M1 Macだから動かない!売却!」というのは浅はかで、調査する能力が問われます。今後はM1が当たり前に使うようになると思いますし、期待しかないと感じました。他にもVagrantはVirtualBoxが利用できないので、代用を考えてみたいと思います。

    今回一緒にフォローしてくれた@naoching7010 あざした!いかにフロントエンドの技術力が足りないことが分かりましたので、皆さんもハマったら参考にしてみてください。

    カテゴリー: M1 MacNode

    adachin

    1989年生まれのFindy/SRE。ホスティングから大規模なアドテクなどのインフラエンジニアとして携わる。現在はサービスの信頼性向上、DevOps、可用性、レイテンシ、パフォーマンス、モニタリング、オブザーバビリティ、緊急対応、AWSでのインフラ構築、Docker開発環境の提供、IaC、新技術の検証、リファクタリング、セキュリティ強化、分析基盤の運用などを担当している。個人事業主では数社サーバー保守とベンチャー企業のSREインフラコンサルティングやMENTA/TechBullで未経験者にインフラのコーチング/コミュニティマネージャーとして立ち上げと運営をしている。また、過去「脆弱性スキャナVuls」のOSS活動もしており、自称エバンジェリスト/技術広報/テクニカルサポート/コントリビュータでもある。

    0件のコメント

    コメントを残す

    このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください