search

cibernox / ember-power-select

The extensible select component built for ember.
http://www.ember-power-select.com
Other
541 stars 379 forks source link

can't import styles after upgrading from 6.0.x to 8.0.x #1856

Closed jalligator closed 2 weeks ago

jalligator commented 3 weeks ago

I realize this is likely an ember-cli-build problem with ember-cli-sass, but I've hit a wall

when I upgraded from ember-power-select 6 to 8 I was no longer able to specify just the package and had to specify the absolute path. I also had to decompile the bootstrap.scss file to get all the relative paths out because all paths in imported files need to be absolute.

// @import 'ember-power-select/themes/bootstrap'; // @import 'ember-power-select'; @import 'node_modules/ember-power-select/themes/bootstrap'; @import 'node_modules/ember-power-select/scss/variables'; @import 'node_modules/ember-basic-dropdown/ember-basic-dropdown'; @import 'node_modules/ember-power-select/scss/base';

I see that the file structure has changed and no longer has app/styles. Is there anything I can do to get back to the documented behavior?

Thanks, John

mkszepp commented 3 weeks ago

@jalligator i need more details to help you.

Do you have any sassOptions set inside your ember-cli-build.js?

Which sass package are you using? (node-sass or dart-sass or any other?) => If you don't have dart-scss i recommend you to move to that, because all other sass packages are deprecated.

A possible workaround for your issue is to add this options inside ember-cli-build.js:

sassOptions: {
      includePaths: ['node_modules/ember-basic-dropdown/', 'node_modules/ember-power-select/'],
    },
jalligator commented 3 weeks ago

@mkszepp thank you for your time!

I'm using sass 1.80.6 which it says is dart-sass.

I actually made a new ember app and everything worked exactly per the power-select documentation. I was able to just import 'ember-power-select'

I went very carefully through ember-cli-build, and even copy and pasted the import statements to make sure there wasn't a typo. The clean app worked just fine, but I simply cannot find what is different between my legacy app I'm updating and the new app. I even npm ls to check versions and they're all the same.

Your workaround works as does explicitly importing from node_modules, but I can't figure out why it can't find the files. Everything works fine on version 6 of ember-power-select too when it had the app / add-on file structure. And I can import from ember-bootstrap/boostrap fine.

Thanks again for any insight. Here's some more output from the error log:

/var/folders/qk/tvn88gsj0zj8r37qwlk7d2nc0000gn/T/broccoli-75900eay2IInhP7Zs/out-429-funnel_funnel_styles/app/styles/app.scss 17:9 root stylesheet at SassCompiler

mkszepp commented 3 weeks ago

Thats fine, when you are using already latest dart-sass... i know that your issue was already in some apps in older versions...

Can you check if some addon brings your a older version of ember-power-select as dependency?

jalligator commented 2 weeks ago

I can confirm that no other version of ember-power-select is in the dependency tree. In fact, I copied the dependency list from package.json on the legacy app to my new test app and the test app still worked correctly. I made to sure to delete dist and node_modules to make sure a newer version of some package wasn't still in node_modules. So I don't think it is a package version issue.

I also tried deleting the dist and node_module directories in the legacy app and I still get the import error.

I do use import for other stylesheets in packages and those work fine but they are all Ember v1 add-on styles.

mkszepp commented 2 weeks ago

Did you also removed the package lock in app or?

If you did that and it wasn't working, so i think it must be any configuration inside ember-cli-build.js or enviroment.js

Can you maybe check this files?

jalligator commented 2 weeks ago

I verified once more that I deleted node_modules and package lock at the same time and reran npm install.

The import now works. I could swear I had already done that, but I must not have.

Thank you for your time! I love the add-on!