box-ui-elements icon indicating copy to clipboard operation
box-ui-elements copied to clipboard

Fails to build with react-scripts 3.3.0

Open drover25 opened this issue 4 years ago • 4 comments

Please fill out the following template so we can reproduce and fix your issue as quickly as possible!

Note: if your issue includes a potential security vulnerability, please do not file it here. Instead, email the issue to [email protected] for support.

Note: if your issue involves previewing files, please report the issue here.

Environment:

  • Elements version:

Desktop (please complete the following information):

  • OS: OSX and Ubuntu Container

Steps to reproduce the problem: react-scripts build with react-scripts 3.30

What is the expected behavior? (Screenshots can be helpful here) Builds without warnings

What went wrong? (Screenshots, console logs, or HAR files can be helpful here) chunk 0 [mini-css-extract-plugin] Conflicting order between:

  • css ../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!../node_modules/postcss-loader/src??postcss!../node_modules/resolve-url-loader??ref--6-oneOf-5-3!../node_modules/sass-loader/dist/cjs.js??re f--6-oneOf-5-4!../node_modules/box-ui-elements/es/components/scroll-wrapper/ScrollWrapper.scss
  • css ../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!../node_modules/postcss-loader/src??postcss!../node_modules/resolve-url-loader??ref--6-oneOf-5-3!../node_modules/sass-loader/dist/cjs.js??re f--6-oneOf-5-4!../node_modules/box-ui-elements/es/components/flyout/Flyout.scss

chunk 0 [mini-css-extract-plugin] Conflicting order between:

  • css ../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!../node_modules/postcss-loader/src??postcss!../node_modules/resolve-url-loader??ref--6-oneOf-5-3!../node_modules/sass-loader/dist/cjs.js??re f--6-oneOf-5-4!../node_modules/box-ui-elements/es/components/selector-dropdown/SelectorDropdown.scss
  • css ../node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!../node_modules/postcss-loader/src??postcss!../node_modules/resolve-url-loader??ref--6-oneOf-5-3!../node_modules/sass-loader/dist/cjs.js??re f--6-oneOf-5-4!../node_modules/box-ui-elements/es/components/flyout/Flyout.scss

drover25 avatar Apr 13 '20 21:04 drover25

Looks like others are having this issue as well https://github.com/facebook/create-react-app/issues/5372#issuecomment-505985237

drover25 avatar Apr 13 '20 21:04 drover25

Having the same warnings with the same scss files

dhebert-dev avatar Jul 17 '20 17:07 dhebert-dev

We were able to resolve this issue on react-scripts 3.4.0 by importing the specific scss files that are causing the issue into the js file that contains the box ui element. For us the scss files that we needed to import were:

import "box-ui-elements/es/components/scroll-wrapper/ScrollWrapper.scss"; import 'box-ui-elements/es/components/flyout/Flyout.scss';

dhebert-dev avatar Jul 21 '20 17:07 dhebert-dev

node sass is deprecated. this is still an issue that pops up from time to time depending on the system and version of node and/or npm. i wish this package just shipped with prebuilt styles.

running into this again. and vercel doesn't build either.

tmaiaroto avatar Oct 08 '21 23:10 tmaiaroto