Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use sass-migrator to update our stylesheets without @import rules #109

Merged
merged 1 commit into from
Nov 4, 2024

Conversation

otegami
Copy link
Collaborator

@otegami otegami commented Oct 29, 2024

Issue

There are some warning when we run npm run serve as follows. Because using @import rules is depreacated now.

$ npm run serve
Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import


2 │ @import "base/mixins",
  │         ^^^^^^^^^^^^^

    _assets/css/main.scss 2:9  root stylesheet

Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import

Solution

We can use Sass migrator which is provided by Sass project. This migrator automatically update your stylesheets to use the module system. It will resove the above warnings.

$ npm install -g sass-migrator
$ sass-migrator module --migrate-deps your-entrypoint.scss

Issue

There are some warning when we run `npm run serve` as follows.
Because using `@import` rules is depreacated now.

```console
$ npm run serve
Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import

  ╷
2 │ @import "base/mixins",
  │         ^^^^^^^^^^^^^
  ╵
    _assets/css/main.scss 2:9  root stylesheet

Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import
```

Solution

We can use Sass migrator which is provided by Sass project.
This migrator automatically update your stylesheets to use the
module system. It will resove the above warnings.

```console
$ npm install -g sass-migrator
$ sass-migrator module --migrate-deps your-entrypoint.scss
```
Copy link
Contributor

@akira888 akira888 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

npm run serveにて見た目への影響なくmigrate できていることを確認しました。
LGTM

@otegami otegami merged commit d35f226 into everyleaf:main Nov 4, 2024
1 check passed
@otegami otegami deleted the remove-import-from-styles branch November 4, 2024 12:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants