Topic

Nuxt.js

A collection of 12 issues

Nuxt.jsでSCSSを使うとき、グローバルの変数を使う

コンポーネントやページでいちいち変数ファイルの依存を追加するのが面倒なので。 どこでも使えるように設定します。 依存ライブラリの追加 yarn add -D @nuxtjs/style-resources 変数定義 SCSS の用意 今回は~/assets/css/variables.scssに作成しました。 // Import Bulma's core @import '~bulma/sass/utilities/_all'; $primary: #10abd0; $primary-invert: findColorInvert($primary); $twitter: #4099ff; $twitter-invert: findColorInvert($twitter); // 以下続く。。。 nuxt.config.js の編集 使用モジュール、設定をそれぞれ追加します。 // nuxt.config.js export default
1 min read

Nuxt.jsでコンポーネントを一括登録する

Nuxt.js + Buefy 開発環境、快適。 いちいちコンポーネントを登録するのがめんどくさい Nuxt.js、便利ですがコンポーネントを作成したらimportするとか.jsファイルに登録するとかちょっと面倒です。 特にプロジェクトで大量に作成しなきゃいけないときとか、登録用の JS ファイルが競合したりもします。 ビルド時に一括読み込み webpackの仕組みで、ビルド時に指定ディレクトリを見て一括登録できます。 Vue.js のドキュメントに書いてありました。 他にも、mixinやfilterも一括登録したいですよね。 それをもとに書き起こしたのがこちら。 // ファイル名をコンポーネント名に変換する function pascal2ComponentName(fileName) { const temp = pascal2camel(fileName) return temp[0].toUpperCase() + temp.substr(1) } // ファイル名をキャメルケースに変換する function
1 min read

Subscribe to 猫好きが猫以外のことも書く

Don’t miss out on the latest issues. Sign up now to get access to the library of members-only issues.
jamie@example.com
Subscribe