0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【初心者】Laravel Mixの周辺について理解する

Posted at

#Laravel Mixとは、
PHPフレームワーク「Laravel」に同梱されているビルドツールです。
現在主流のWebpackがベースになっており、Laravelを使用しなくても使うことができます。
とにかく設定ファイルがシンプルで、ビルド(ソースコードなどを元に実行可能ファイルや配布パッケージを作成する処理や操作のこと/コンパイルを含む)のスピードも申し分ありません。
package.jsonに設定を記入すると、Webpackやsassの環境構築、Bootstrapのセットアップなどを、
時間をかけずに自動的に圧縮等の処理をしてくれます。

#Webpack
モジュールをバンドル(束ねる)するツールです。
モジュールとは、プログラム内のJavaScriptファイル(以下:jsファイル)やsassファイルなどのことです。webpackを使うことで、複数のjsファイルをひとつのjsファイルにまとめたり、複数のsassファイルをひとつのsassファイルにしたりできます。
https://goworkship.com/magazine/how-to-webpack/

#Bootstrap
Twitter社が開発したCSSの「フレームワーク」です。通常CSSを書く場合、全てのスタイルを自分で作っていく必要がありますが、このフレームワークにはよく使われるスタイルがあらかじめ定義してあるので、ルールに沿って利用するだけで整ったデザインのページを作成できます。

#node.js
PHPのようにサバ―サイドでJavaScriptを動かせるプラットフォームがあり、中でも代表的なのがNode.jsだ。他にそこまで有名なものもないので、「Node.js = サーバサイドJavaScript」だと認識しておけばいいだろう。
サーバサイドで動くというとPHPなどと一緒だと思われたかもしれないが、実はまったく違う。
そもそもNode.jsがサーバサイドで動くプログラムという説明自体が正確ではない。より正確に言うと、Node.jsはサーバサイドでJavaScriptを実行できるようにしてくれるものだ。プラットフォームという表現が正しい。

#node.js のバージョンを管理するnodebrew
nodebrewを使うことで、一つの環境に複数のバージョンのNode.jsを導入することができます。
Web開発でNode.jsが頻繁に使われる昨今、特にnpmのバージョン互換性が問題となる場合が多いです。そんな中で、複数のプロジェクト用に別々のパッケージを保持したNodeを管理できたり、Nodeのバージョンを即座に切り替えたりできるのは大きなメリットだと思います。

ディレクトリ直下にあるwebpack.mix.jsを編集し、
作成したsassファイルをコンパイルするように記入する。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?