質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.51%
EJS

EJSは、JavaScript用のテンプレートエンジン。HTMLなどのテンプレートテキストにJavaScriptのロジックを記述することができます。また、変数・関数の実行をテンプレートテキスト内に埋め込むことも可能です。

Yarn

Yarnは、Facebook/Exponent/Google/Tildeが開発したJavaScriptのパッケージマネージャ。npmよりもインストールが速く、厳密にモジュールのバージョンを固定できるなど、npmの問題を解決。npmと互換性があり、同じpackage.jsonを使用できます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

レスポンシブWebデザイン

レスポンシブWebデザイン(RWD)は、スクリーンのサイズ、プラットフォーム、オリエンテーションに基づいて様々なデバイスで最適のサイトを生成するのウェブデザインとその開発のアプローチ方法を呼びます。

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

Q&A

解決済

1回答

1666閲覧

yarnを使ったレスポンシブウェブデザイン作成について

moooaka

総合スコア5

EJS

EJSは、JavaScript用のテンプレートエンジン。HTMLなどのテンプレートテキストにJavaScriptのロジックを記述することができます。また、変数・関数の実行をテンプレートテキスト内に埋め込むことも可能です。

Yarn

Yarnは、Facebook/Exponent/Google/Tildeが開発したJavaScriptのパッケージマネージャ。npmよりもインストールが速く、厳密にモジュールのバージョンを固定できるなど、npmの問題を解決。npmと互換性があり、同じpackage.jsonを使用できます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

レスポンシブWebデザイン

レスポンシブWebデザイン(RWD)は、スクリーンのサイズ、プラットフォーム、オリエンテーションに基づいて様々なデバイスで最適のサイトを生成するのウェブデザインとその開発のアプローチ方法を呼びます。

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

0グッド

1クリップ

投稿2019/11/19 15:20

以下のエラーの意味を理解し解決したいです。
現在レスポンシブのWebページを作成中で、ejsとscssを使いコーディングし、パッケージマネジャーはyarnです。

以下のエラーはyarn startでローカルホストを立ち上げた際に出ているものです。

bundle.js:20084 Uncaught Error: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js): ModuleBuildError: Module build failed (from ./node_modules/sass-loader/lib/loader.js): Error: Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (72) For more information on which environments are supported please see: https://github.com/sass/node-sass/releases/tag/v4.11.0 at module.exports (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/node-sass/lib/binding.js:13) at Object.<anonymous> (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/node-sass/lib/index.js:14) at Module._compile (:8080/internal/modules/cjs/loader.js:936) at Object.Module._extensions..js (:8080/internal/modules/cjs/loader.js:947) at Module.load (:8080/internal/modules/cjs/loader.js:790) at Function.Module._load (:8080/internal/modules/cjs/loader.js:703) at Module.require (:8080/internal/modules/cjs/loader.js:830) at require (:8080/internal/modules/cjs/helpers.js:68) at Object.sassLoader (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/sass-loader/lib/loader.js:46) at :8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/webpack/lib/NormalModule.js:301 at :8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:367 at :8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:233 at runSyncOrAsync (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:143) at iterateNormalLoaders (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:232) at Array.<anonymous> (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:205) at Storage.finished (:8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:43) at :8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:79 at :8080/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/graceful-fs/graceful-fs.js:90 at FSReqCallback.readFileAfterClose [as oncomplete] (:8080/internal/fs/read_file_context.js:61) at Object../src/scss/app.scss (bundle.js:20084) at __webpack_require__ (bootstrap:19) at Object../src/js/index.js (index.js:3) at __webpack_require__ (bootstrap:19) at Object.0 (bundle.js:20096) at __webpack_require__ (bootstrap:19) at bootstrap:83 at bootstrap:83 ./src/scss/app.scss @ bundle.js:20084 __webpack_require__ @ bootstrap:19 ./src/js/index.js @ index.js:3 __webpack_require__ @ bootstrap:19 0 @ bundle.js:20096 __webpack_require__ @ bootstrap:19 (anonymous) @ bootstrap:83 (anonymous) @ bootstrap:83 client:162 [WDS] Errors while compiling. Reload prevented. errors @ client:162 onmessage @ socket.js:41 EventTarget.dispatchEvent @ sockjs.js:170 (anonymous) @ sockjs.js:887 SockJS._transportMessage @ sockjs.js:885 EventEmitter.emit @ sockjs.js:86 WebSocketTransport.ws.onmessage @ sockjs.js:2961 client:168 ./src/js/index.js Module Error (from ./node_modules/eslint-loader/index.js): /Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/src/js/index.js 11:1 error 'app' is not defined no-undef 11:9 error 'express' is not defined no-undef ✖ 2 problems (2 errors, 0 warnings) errors @ client:168 onmessage @ socket.js:41 EventTarget.dispatchEvent @ sockjs.js:170 (anonymous) @ sockjs.js:887 SockJS._transportMessage @ sockjs.js:885 EventEmitter.emit @ sockjs.js:86 WebSocketTransport.ws.onmessage @ sockjs.js:2961 client:168 ./src/scss/app.scss Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js): ModuleBuildError: Module build failed (from ./node_modules/sass-loader/lib/loader.js): Error: Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (72) For more information on which environments are supported please see: https://github.com/sass/node-sass/releases/tag/v4.11.0 at module.exports (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/node-sass/lib/binding.js:13:13) at Object.<anonymous> (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/node-sass/lib/index.js:14:35) at Module._compile (internal/modules/cjs/loader.js:936:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:947:10) at Module.load (internal/modules/cjs/loader.js:790:32) at Function.Module._load (internal/modules/cjs/loader.js:703:12) at Module.require (internal/modules/cjs/loader.js:830:19) at require (internal/modules/cjs/helpers.js:68:18) at Object.sassLoader (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/sass-loader/lib/loader.js:46:72) at /Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/webpack/lib/NormalModule.js:301:20 at /Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:367:11 at /Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:233:18 at runSyncOrAsync (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:143:3) at iterateNormalLoaders (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:232:2) at Array.<anonymous> (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/loader-runner/lib/LoaderRunner.js:205:4) at Storage.finished (/Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:43:16) at /Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:79:9 at /Users/mochiji/Desktop/kadai-1/kadai_PC/kadai_LP_1/node_modules/graceful-fs/graceful-fs.js:90:16 at FSReqCallback.readFileAfterClose [as oncomplete] (internal/fs/read_file_context.js:61:3) errors @ client:168 onmessage @ socket.js:41 EventTarget.dispatchEvent @ sockjs.js:170 (anonymous) @ sockjs.js:887 SockJS._transportMessage @ sockjs.js:885 EventEmitter.emit @ sockjs.js:86 WebSocketTransport.ws.onmessage @ sockjs.js:2961 client:177 [WDS] Disconnected! ここより以下は文字制限、重要ではないと思われる?為ひとまず省きます

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

2KOH

2019/11/19 23:27

エラーが発生するまでの手順を提示してください。 具体的には、以下の「不明」の部分を提示してください。 1. Node.js と Yarn をインストールする。 2. 不明 3. yarn start を実行すると、エラーが発生する。 エラーメッセージを元に上記の不明の部分の手順を推測することは頑張ればできるかもしれませんが、質問者が提示してくれさえすれば済む話です。
gentaro

2019/11/20 03:31

yarnだろうがnpmだろうがパッケージ管理をするだけのモノなので、「レスポンシブウェブデザイン作成」とどう関連するのかよくわからない。
guest

回答1

0

自己解決

node.js、yarnのバージョンを変えることで解決しました。

投稿2020/03/05 23:25

moooaka

総合スコア5

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.51%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問