タグ検索の該当結果が少ないため、タイトル検索結果を表示しています。
さてさて、前々回「Vue 3の新しい機能と変更点・全９件」という記事を紹介しましたが、この中でひとつ気になるところがありました。 それは、 Vue 3はTypeScriptをサポートしました という部分です。 個人的には、JavaScriptをビルドするというのはあまり好きではないのですが、TypeScriptの評判がいいのは日々実感していたので、「食わず嫌い」にならないよう体験してみることにしました。 そこで！ 今回はLaravel MixでTypeScriptを使う方法をご紹介します。 ぜひ楽しみながらやってみましょう！ 「最近マイクロソフトがマジ本気ですよね❗」 開発環境： Laravel 7.x、TypeScript 3.8.3 準備する TypeScriptをインストールする まずパソコンのどこからでもTypeScriptが実行できるようにします。 以下のコマンドを実行してくださ
様々なビルドツールを渡り歩いた末にLaravel Mixを選択した理由 2020年版 作業環境を晒します〜フロントエンド開発環境編〜 - arms inc. Engineers' Blog
以前の記事で、「次回はさらにフロントエンド開発に寄せて、モジュールバンドラやタスクランナーについてご紹介できたら」と予告していましたが脱線してしまいましたので、今回はビルドツールにスポットを当てたいと思います。 tech.arms-soft.co.jp ビルドツールとは 今ではフロントエンドの開発環境にはなくてはならないと言っても良いほどのツールです。 主に下記の処理を行なってくれます。 pug、EJSなどのテンプレートエンジン SASS、PostCSSなどのCSSプリプロセッサ モジュールの依存関係の解決 BabelなどのJavascriptトランスパイラ Vue、Reactなどのフレームワーク stylelint、eslintなどの構文チェッカー さらに、画像の圧縮やブラウザのオートリロードなど、様々な動作を行なってくれます。 ただ便利な反面、様々なツールが登場し続けていて、そのツール
Laravel Mixでフロントエンド開発環境を手軽に構築 2020年版 作業環境を晒します〜フロントエンド開発環境編〜 - arms inc. Engineers' Blog
前回の記事でビルドツール遍歴をご紹介しましたが、今回は現在使用しているLaravel Mixの設定についてご紹介します。 tech.arms-soft.co.jp Webpackを使用するとなると設定が複雑で行数も結構な数になってしまいますが、Laravel Mixを使うことで少ない行数で設定できてしまうので、簡単にフロントエンドの開発環境を構築できます。 サンプルファイルもダウンロードできますので、興味がありましたらお試しください。 そもそもLaravel Mixとは Laravel Mixは、PHPフレームワーク「Laravel」に同梱されているビルドツールです。 現在主流のWebpackがベースになっており、Laravelを使用しなくても使うことができます。 とにかく設定ファイルがシンプルで、ビルドのスピードも申し分ありません。 1. まずはインストール 該当のディレクトリで下記コマ
今回は、Laravel MixでSass・JavaScriptなどをコンパイルした際に、ソースマップを出力する設定方法となります。 また、今回の例ではLaravel Mix をすでにインストールしている前提としています。Laravel Mix のインストール方法などについては、以下のリンク先を参考にしてみてください。 【Laravel Mix】Sass・JavaScriptのソースマップを出力する設定方法Laravel Mixでは、設定をwebpack.mix.jsファイルで管理します。 以下、webpack.mix.jsに、ソースマップを出力する.sourceMaps()メソッドを追加した設定例となります。 const mix = require('laravel-mix'); mix.js('resources/js/app.js', 'public/js') .sass('resou
はじめに この記事はLaravel Mix初導入に挑戦した際、勉強したことをまとめたものです。 webpackやNode.jsに関する知識などが少ないひよっ子ですので、間違いなどありましたらご教示頂けるとうれしいです 1. Laravel Mixとは SassやES6のコンパイルなどが簡単にできる便利なビルドツール。 webpackのラッパーAPI。（="webpackを操作しやすくしたもの"というイメージ） Laravel Mixという名前から勘違いしてましたが、Laravel無しでも使えるんですね。 ↓こちらでの説明がとてもわかりやすかったです。 初めてのLaravel Mix | アールエフェクト 2. やりたいこと Sassのコンパイル Pugの導入、コンパイル ES6+からES5へのコンパイル、バンドル、IE11対応 ファイル変更を監視してブラウザをオートリロード 3. いざ導入
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Laravel MixでTypeScriptを使う
【Laravel Mix】ソースマップを出力する設定方法｜Sass・JavaScript
はじめてのLaravel Mix - Qiita
comic-walker.com
www.ricoh.co.jp
seadenden-8bit.com
dailyportalz.jp
www.ricoh.co.jp
masayuki0.lo.gob.jp