Motomichi Works Blog

モトミチワークスブログです。その日学習したことについて書いている日記みたいなものです。

sass

Nuxt.js 2.x + TypeScript 4.x その0009 Sassの変数やmixinを全てのコンポーネントで使えるようにする

参考にさせていただいたページ 《Nuxt.js》Sassの共通の変数やmixinを一括で各コンポーネントに読み込む方法。 - Qiita GitHub - nuxt-community/style-resources-module: Nobody likes extra @import statements! style-resources-module のインストール 「…

Nuxt.js 2.x + TypeScript 4.x その0003 Sassを使えるようにする

参考にさせていただいたページ 公式ページ css プロパティ - NuxtJS その他のページ Nuxt.jsプロジェクトでDart Sassを使う | kimulaco blog 今日の開発環境 Nuxt 2.14.12 TypeScript 4.2.3 パッケージのインストール 公式ページに倣って以下の通りインスト…

webpack4.x + sass-loader + postcss-loader + autoprefixerでscssファイルをコンパイルする

今日の環境 Windows10 Home node 12.13.1 npm 6.13.1 webpack 4.41.2 webpack-cli 3.2.3 プロジェクトディレクトリを作成 mkdir webpack_4_scss_introduction cd webpack_4_scss_introduction npm initする npm init グローバルにインストール npm install -…

webpack4.xでscssファイルをコンパイルする

参考にさせて頂いたページ 設定全般 最新版で学ぶwebpack 4入門 - スタイルシート(CSSやSass)を取り込む方法 - ICS MEDIA ExtractTextPluginをwebpack 4 で使用する方法について Webpack 4 · Issue #760 · webpack-contrib/extract-text-webpack-plugin · Gi…

compassでcompileしようと思ったらTypeError on line ["43"] of c: no implicit conversion of Array into String Run with --trace to see the full backtraceというエラーが出た

結論から compass compile scss/style.scss を実行するディレクトリパスと、コンパイル後のcssを出力するディレクトリパスを合わせた文字列が長すぎるとエラーが出るみたい。 なので、少し短くしたら直った。 実行したコマンド compass compile scss/style.s…

compassで生成されるスプライト画像のランダム文字列を除去する

参考にさせて頂いたページ Sass/Compass よくあるトラブルと 解決方法・回避方法 config.rbに追記する 参考にさせて頂いたというか、「52/99ページ目」のところにあるソースコードをそのまま真似て以下の記述をした。 on_sprite_saved do |filename| if File…