sunqian1991/px2rwd-intellij-plugin

用于将css中的px转换为rem/em/vw/vh值的IntelliJ插件，支持idea和webstorm

PX2RWD-Intellij-Plugin

中文

Description

This is a tool of converting px to rem/vw/vh in a css/less file by a few settings used in intellij idea or webstorm.

Install

This plugin has been put in the market and you can find it in file - settings - plugins - marketplace by searching a text of px2rem.

You can also download the plugin file which has been put in release, and install the plugin from disk.

Contact me

If you have any questions or suggestions, please contact me.

QQ: 991637393

email: [email protected]

Usage

there are three ways to convert: short-cut key, code intention, code completion. you can find the settings related to these converting ways in settings page with the path 'File - Settings - Px to Rem'

1. short-cut key

select a converting type from three options of rem, vw, vh in setting page and give a necessary value set below the radio group, then use the default short-cut key of Alt + d to convert a line or a selected text. you can also use the short-cut key of Ctrl + Alt + d to convert in a whole file. you can only choose one converting type of short-cut key from rem,vw,vg to convert. btw, you can change the short-cut key in your ide by setting the keymap option.

2. code intention

you can find three code intention types in settings page and you can select if a code intention type works by check the checkbox. by check a code intention in a line of a css file, which will display by typing Alt + Shift, you can convert the line where the caret displays. the unselected code intention types in settings page will not show in the list of code intention in a css file

3. code completion

you can also find three code completion types in the settings page and you can select if a code completion type works by check the checkbox. by typing 'px' in a css file, you can find some code completion types you set in settings page. choose a type then it will give a result of converting. the unselected code completion types in settings page will not show in the list of code completion in a css file

Instructions:

1. find menu at 'File - Settings - Px to Rem', and give some settings.
2. select a text or move cursor at a line which contains a 'px' value.
3. use default shortcut key Alt + d to convert px to rem/vw/vh with a line; btw, you can change the shortcut at 'File - Settings - keymap - Plug-ins - px2rem'.
4. use default shortcut key Ctrl + Alt + d to convert px to rem/vw/vh in a whole file.
5. use a code intention to convert px to rem/vw/vh in a css file
6. use a code completion to convert px to rem/vw/vh in a css file
7. use the short-cut key Ctrl + Shift + Alt + d to rollback the converting within one line

px2rwd-intellij-plugin's Issues

希望能把jar包帮忙打出来，用webstorm的小前端...本地没有java环境...

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

Add as an intention action

First of all, thanks for the plugin.

Would be great if you added px2rem as an intention action to be offered when Ctrl + Enter is clicked on the px value, example:

异常

我的 ws 也安装了px2rem,但是我重启之后 在file-setting下没有找到这个px2rem a

e好像webstorm上面整个文件的转化似乎无效，通过快捷键无法触发，是否可以添加对rpx的支持呢

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

希望 全部转换中 增加 最小1px 不转换

希望 全部转换中 增加 最小1px 不转换

因为有些1px 我不需要转rem 在转就看不见了

Check file type

Hello again!

When working with markup in * .pug, the 'Shift + D' key combination does not allow typing an uppercase letter.

Can you make the plugin work only when working with style files?
*.css, *.less, *.sass, *.scss, *.styl

P.S. Perhaps you'll remember any other file extensions I came up with only these.

快捷键无效

ctrl + alt + d 没有任何作用。不能格式化css文件中的px为rem。
但是使用alt + d是可以格式化单行的px。
比较奇怪。

可以把保留位数添加到配置里面吗？

终于等到你~
之前一直用前作者的插件，但是太久没维护了，满足不了日常使用了，你的挺好用的鸭！
现在保留位数是三位，可以把保留位数作为配置项暴露给用户吗？

Multiple cursors action not updating all values

Describe the bug
The conversion only changes the last cursor when multiple cursors are active

To Reproduce
Steps to reproduce the behaviour:

1. copy/paste on a CSS file

.foo {
  padding: 16px;
  margin: 16px;
  font-size: 16px;
}

2. add a cursor on each 16px
3. trigger px 2 rem
4. Only the last one will change

Expected behaviour
All values on cursors to update.

Desktop (please complete the following information):

• OS: Ubuntu 20.04
• IntelliJ IU-202.6397.94, JRE 11.0.7+10-b944.20x64 JetBrains

知道怎么获取光标所在行么？

每次输完都要选中很麻烦的，输完直接快捷键就好了

对插件功能的一些建议

非常好的插件，期待作者能再接再厉，将px2vw整合进去，然后通过代码的智能提示选择转成vw或rem。

在m1上不可用

在mac m1上不可用，设置一直在loading状态。

提供一个跳过转换的标记功能

平常习惯使用整个文件转换的快捷键，但是有时候有的px不希望被转，希望提供一种方案，比如添加ignore标记

能否过滤特定的数值

我希望当我按下快捷键使用全局转换时可以过滤类似height:1px;这样的数值。比如添加注释？

Remove round to 2 decimals

Issue:
width: 70px; // now transforms to width: 4.38rem
which in reality is 70.08px

so if the round would return the full value like 4.375rem the final value would be 70px.

base px: 16.

1000倍转换的时候丢失精度 只保留了两位小数

321px=>0.32rem 应该是0.321rem

没有显示转换提示

webstorm 2022.3.2版本
输入'px'后没有显示转换提示，只能通过手动快捷键转换，这个是怎么回事?

Comma instead of dot

Extension when converting began to put a comma instead of a dot, convert with Alt+D

Reverse conversion

Hi! Thank you very much for the plugin it really makes life easier!

Have you considered converting back from rem to px? This would allow us to estimate the size in the usual units, correct and convert back to rem.

Make this feature only for linear conversion. Check for units and convert accordingly.

Rollback doesn't work on Mac

i've tried your keymap: Ctrl + Shift + Alt (Option) + d it has no effect. Is there a way to convert REM back to px?

Rollback doesn't work inside a .vue file

MacOS 10.15 / WebStorm 2019.2.3

Vue component:

// template code here
<style lang="scss">
.class {
  font-size: 16px;
}
</style>

When i press ⌥+D, it does convert px to rem, but when i do a rollback Shift+⌥+⌘+D, it doesn't rollback, though if i do the same combination inside a .scss file, it does work as intended, only workaround for now is to use an action panel: