React on rails错误导入CSS

时间:2018-01-17 15:03:39

标签: css reactjs ruby-on-rails-4 webpack react-on-rails

我在进行导入时遇到此错误' styles.css'我对rails app的反应

Uncaught Error: Module build failed: ModuleBuildError: Module build failed: Error: Loading PostCSS Plugin failed: Cannot find module 'postcss-smart-import'
at Function.Module._resolveFilename (module.js:527:15)
at Function.Module._load (module.js:476:23)
at Module.require (module.js:568:17)
at require (internal/module.js:11:18)
at load (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-plugins/lib/plugins.js:44:18)
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-plugins/lib/plugins.js:66:18
at Array.forEach (<anonymous>)
at plugins (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-plugins/lib/plugins.js:65:8)
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-config/index.js:64:18
at <anonymous>
at runLoaders (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/webpack/lib/NormalModule.js:195:19)
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/loader-runner/lib/LoaderRunner.js:364:11
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/loader-runner/lib/LoaderRunner.js:230:18
at context.callback (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at Promise.resolve.then.then.catch (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-loader/lib/index.js:189:71)
at <anonymous>
at Function.Module._resolveFilename (module.js:527:15)
at Function.Module._load (module.js:476:23)
at Module.require (module.js:568:17)
at require (internal/module.js:11:18)
at load (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-plugins/lib/plugins.js:44:18)
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-plugins/lib/plugins.js:66:18
at Array.forEach (<anonymous>)
at plugins (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-plugins/lib/plugins.js:65:8)
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-load-config/index.js:64:18
at <anonymous>
at runLoaders (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/webpack/lib/NormalModule.js:195:19)
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/loader-runner/lib/LoaderRunner.js:364:11
at /Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/loader-runner/lib/LoaderRunner.js:230:18
at context.callback (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at Promise.resolve.then.then.catch (/Users/mdiaz00147/Desktop/Ruby/cryptoStudio/node_modules/postcss-loader/lib/index.js:189:71)
at <anonymous>
at Object.<anonymous> (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:25280:7)
at __webpack_require__ (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:20:30)
at Object.<anonymous> (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:24995:72)
at __webpack_require__ (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:20:30)
at Object.defineProperty.value (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:19910:110)
at __webpack_require__ (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:20:30)
at emptyFunction (http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:63:18)
at http://localhost:3002/packs/crypto-studio-fc0f59f190b05f88cbd0.js:66:10

我已经尝试了删除node_modules并重新安装的所有内容,我已经尝试编辑webpack.xml以进入我的资源文件夹而没有任何工作。谢谢你的帮助。

1 个答案:

答案 0 :(得分:0)

与rails有同样的问题,我基本上只是添加了缺少的依赖来解决它。

yarn add postcss-smart-import

另外一定要使用3.0.2或3.2.0版本的gem。

并且不要忘记更新纱线。

bundle update webpacker
yarn upgrade @rails/webpacker

希望它也会对你有帮助。