Uncaught Error: Module build failed

Annie O'Grady
Any ideas why am i seeing this in console? Is it a warning or showstopper?

Uncaught Error: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/postcss-loader/dist/cjs.js):
SyntaxError

(13:2) /Users/annieogrady/workspace/bright-assess/app/javascript/stylesheets/components/base.scss The `text-primary-500` class does not exist. If `text-primary-500` is a custom class, make sure it is defined within a `@layer` directive.

  11 | 
  12 | a {
> 13 |   @apply text-primary-500;
     |  ^
  14 | 
  15 |   &:hover,

    at processResult (:3000/Users/annieogrady/workspace/bright-assess/node_modules/webpack/lib/NormalModule.js:690)
    at :3000/Users/annieogrady/workspace/bright-assess/node_modules/webpack/lib/NormalModule.js:792
    at :3000/Users/annieogrady/workspace/bright-assess/node_modules/loader-runner/lib/LoaderRunner.js:399
    at :3000/Users/annieogrady/workspace/bright-assess/node_modules/loader-runner/lib/LoaderRunner.js:251
    at context.callback (:3000/Users/annieogrady/workspace/bright-assess/node_modules/loader-runner/lib/LoaderRunner.js:124)
    at Object.loader (:3000/Users/annieogrady/workspace/bright-assess/node_modules/postcss-loader/dist/index.js:94)
    at Object../app/javascript/stylesheets/components.scss (application-0ba3bef0dc01e96722e4.js:115)
    at __webpack_require__ (runtime-ed6992d2c7640550d57e.js:31)
    at eval (application.js:375)
    at Module../app/javascript/packs/application.js (application-0ba3bef0dc01e96722e4.js:63)
    at __webpack_require__ (runtime-ed6992d2c7640550d57e.js:31)
    at __webpack_exec__ (application-0ba3bef0dc01e96722e4.js:134)
    at application-0ba3bef0dc01e96722e4.js:135
    at Function.__webpack_require__.O (runtime-ed6992d2c7640550d57e.js:79)
    at application-0ba3bef0dc01e96722e4.js:136
    at webpackJsonpCallback (runtime-ed6992d2c7640550d57e.js:293)
./app/javascript/stylesheets/components.scss @ application-0ba3bef0dc01e96722e4.js:115
__webpack_require__ @ runtime-ed6992d2c7640550d57e.js:31
eval @ application.js:375
./app/javascript/packs/application.js @ application-0ba3bef0dc01e96722e4.js:63
__webpack_require__ @ runtime-ed6992d2c7640550d57e.js:31
__webpack_exec__ @ application-0ba3bef0dc01e96722e4.js:134
(anonymous) @ application-0ba3bef0dc01e96722e4.js:135
__webpack_require__.O @ runtime-ed6992d2c7640550d57e.js:79
(anonymous) @ application-0ba3bef0dc01e96722e4.js:136
webpackJsonpCallback @ runtime-ed6992d2c7640550d57e.js:293
(anonymous) @ application-0ba3bef0dc01e96722e4.js:9

VM1006 livereload.js:191 WebSocket connection to 'ws://localhost:35729/livereload' failed:

Kevin Penner
Some options to solve are:
- make sure a 'primary' color is defined in your tailwind.config.js file (app/javascript/stylesheets)
- rename the class used in the @apply to a standard color name, i.e. text-blue-500
Notifications
You’re not receiving notifications from this thread.
Subscribe
© 2021 GoRails, LLC