yuki0920 / supplebox

Rails×Nuxt製プロテイン口コミ共有サービス「SuppleBox(サプリボックス)」
24 stars 5 forks source link

Node-sassを読み込めない問題を解消したい #372

Closed yuki0920 closed 3 years ago

yuki0920 commented 3 years ago

Vue.jsのSFCのstyleでlang="scss"を使うと出るエラー

Uncaught Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
Error: Missing binding /myapp/node_modules/node-sass/vendor/linux-x64-64/binding.node
Node Sass could not find a binding for your current environment: Linux 64-bit with Node.js 10.x

Found bindings for the following environments:
  - OS X 64-bit with Node.js 10.x

This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass` to download the binding for your current environment.
    at module.exports (:3001/myapp/node_modules/node-sass/lib/binding.js:15)
    at Object.<anonymous> (:3001/myapp/node_modules/node-sass/lib/index.js:14)
    at Module._compile (:3001/myapp/node_modules/v8-compile-cache/v8-compile-cache.js:192)
    at Object.Module._extensions..js (:3001/internal/modules/cjs/loader.js:789)
    at Module.load (:3001/internal/modules/cjs/loader.js:653)
    at tryModuleLoad (:3001/internal/modules/cjs/loader.js:593)
    at Function.Module._load (:3001/internal/modules/cjs/loader.js:585)
    at Module.require (:3001/internal/modules/cjs/loader.js:692)
    at require (:3001/myapp/node_modules/v8-compile-cache/v8-compile-cache.js:159)
    at getDefaultSassImplementation (:3001/myapp/node_modules/sass-loader/dist/getDefaultSassImplementation.js:24)
    at getSassImplementation (:3001/myapp/node_modules/sass-loader/dist/getSassImplementation.js:19)
    at Object.loader (:3001/myapp/node_modules/sass-loader/dist/index.js:40)
    at Object../node_modules/css-loader/dist/cjs.js?!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/dist/index.js?!./app/javascript/components/Nav/index.vue?vue&type=style&index=0&id=73e0c9e3&lang=scss&scoped=true (index.vue:125)
    at __webpack_require__ (bootstrap:19)
    at Object../node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js?!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/postcss-loader/src/index.js?!./node_modules/sass-loader/dist/cjs.js?!./node_modules/vue-loader/dist/index.js?!./app/javascript/components/Nav/index.vue?vue&type=style&index=0&id=73e0c9e3&lang=scss&scoped=true (index.vue?87b5:2)
    at __webpack_require__ (bootstrap:19)
    at Module../app/javascript/components/Nav/index.vue?vue&type=style&index=0&id=73e0c9e3&lang=scss&scoped=true (index.vue?7f74:1)
    at __webpack_require__ (bootstrap:19)
    at Module../app/javascript/components/Nav/index.vue (index.vue?d2d5:1)
    at __webpack_require__ (bootstrap:19)
    at Module../app/javascript/packs/navigation.ts (navigation.ts:1)
    at __webpack_require__ (bootstrap:19)

DockerコンテナのLinux用のNode Sassをインストールできていない

参考

rails webpacker:install node-sass: Command failed. - Qiita 【エラー】Error: Missing binding /myapp/node_modules/node-sass/vendor/linux-x64-64/binding.node【Ruby on Rails】 | nabelog Dockerfile for Rails6のベストプラクティスを解説 - Qiita

yuki0920 commented 3 years ago

実行ログ

node-sass最新バージョンのインストール

$ dc run --rm web yarn add node-sass --force
WARNING: Found orphan containers (supplebox_chrome_1) for this project. If you removed or renamed this service in your compose file, you can run this command with the --remove-orphans flag to clean it up.
Creating supplebox_web_run ... done
yarn add v1.22.5
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.3.2: The platform "linux" is incompatible with this module.
info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.13: The platform "linux" is incompatible with this module.
info "fsevents@1.2.13" is an optional dependency and failed compatibility check. Excluding it from installation.
error node-sass@6.0.0: The engine "node" is incompatible with this module. Expected version ">=12". Got "10.24.0"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.