質問編集履歴
6
試してみたサービスを追記しています。(cssnano)
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
(仕事中は見つけたものを手当たり次第試してたので、思い出せる範囲内で記録。)
|
|
27
27
|
|
|
28
28
|
- [W3C CSS Validation Service](https://jigsaw.w3.org/css-validator/) - 重複していても、「おめでとうございます！エラーはありません」という結果になる。
|
|
29
|
-
- [CSSO](https://css.github.io/csso/csso.html) -
|
|
29
|
+
- [CSSO](https://css.github.io/csso/csso.html),[cssnano](https://cssnano.co/) - デフォルトCSSと追加CSSが統合されてしまい、追加CSSの分だけ取り出すことが出来ず失敗。
|
|
30
30
|
- [difff](https://difff.jp/) - 単純な文章の差分を探すサービスなので、重複しているスタイルなどは抽出できず失敗。
|
|
31
31
|
- [CSS LINT](http://csslint.net/),[SYNCER](https://lab.syncer.jp/Tool/CSS-PrettyPrint/),[WebTools](http://tm-webtools.com/Tools/CssBeauty),[CSS Portal](https://www.cssportal.com/format-css/) - インデントや改行の整形機能のみだったため失敗。
|
|
32
32
|
- [Pretty Diff](https://prettydiff.com/) - 英語かつ、構成が難解で、目的の機能を達成しているかどうかのテストすら難しい。実行結果のどこをコピーしていけば目的の部分を抽出できるのか分からず、実用的じゃない。
|
5
実際に試した行動を追記しています。（勉強会で相談してみました。）
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -22,13 +22,22 @@
|
|
|
22
22
|
整形ツールで統合してから、プロパティが無意味な文字になっている行だけ削除する、みたいな手法を考えてみたのですが、
|
|
23
23
|
それは最終的にただ単に追加CSSで（重複する部分も含めて）全て上書きするだけの結果になってしまい、時間を無駄にしてしまったことを後悔しています。
|
|
24
24
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
[
|
|
31
|
-
[
|
|
25
|
+
#### 具体的に試してみたサービス
|
|
26
|
+
(仕事中は見つけたものを手当たり次第試してたので、思い出せる範囲内で記録。)
|
|
27
|
+
|
|
28
|
+
- [W3C CSS Validation Service](https://jigsaw.w3.org/css-validator/) - 重複していても、「おめでとうございます！エラーはありません」という結果になる。
|
|
29
|
+
- [CSSO](https://css.github.io/csso/csso.html) - 項目が統合され、更に並び替えられてしまい、追加CSSの分だけ取り出すことが出来ず失敗。
|
|
30
|
+
- [difff](https://difff.jp/) - 単純な文章の差分を探すサービスなので、重複しているスタイルなどは抽出できず失敗。
|
|
31
|
+
- [CSS LINT](http://csslint.net/),[SYNCER](https://lab.syncer.jp/Tool/CSS-PrettyPrint/),[WebTools](http://tm-webtools.com/Tools/CssBeauty),[CSS Portal](https://www.cssportal.com/format-css/) - インデントや改行の整形機能のみだったため失敗。
|
|
32
|
+
- [Pretty Diff](https://prettydiff.com/) - 英語かつ、構成が難解で、目的の機能を達成しているかどうかのテストすら難しい。実行結果のどこをコピーしていけば目的の部分を抽出できるのか分からず、実用的じゃない。
|
|
33
|
+
- [WinMerge](https://forest.watch.impress.co.jp/library/software/winmerge/) - Mac非対応のためテスト不可。
|
|
34
|
+
- [Diff Checker](https://www.diffchecker.com/diff) - 左方に !important を入れたり、右方に書いてないセレクタを左方に書いても左方が赤く表示されるので目的の機能ではない。
|
|
35
|
+
|
|
36
|
+
#### 勉強会で相談してみた結果
|
|
37
|
+
- 未使用のCSSを削除してくれるサービスを使って、重複している項目をリストアップする方法を提案されました。
|
|
38
|
+
→この方法だと、追加CSSで値を上書きしているプロパティまで、デフォルトCSSで未使用と判断されてリストアップされてしまう。結局重複してるのか上書きしているのかを目視で確認する必要がある。
|
|
39
|
+
|
|
40
|
+
|
|
32
41
|
### 補足情報
|
|
33
42
|
作業環境はMac OSXです。
|
|
34
43
|
デフォルトCSSを取得することはできますが、削除することはできません。
|
4
実際に試したサービスを追記しています。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -28,6 +28,7 @@
|
|
|
28
28
|
[CSS LINT](http://csslint.net/),[SYNCER](https://lab.syncer.jp/Tool/CSS-PrettyPrint/),[WebTools](http://tm-webtools.com/Tools/CssBeauty),[CSS Portal](https://www.cssportal.com/format-css/) - インデントや改行の整形機能のみだったため失敗。
|
|
29
29
|
[Pretty Diff](https://prettydiff.com/) - 英語かつ、構成が難解で、目的の機能を達成しているかどうかのテストすら難しい。実行結果のどこをコピーしていけば目的の部分を抽出できるのか分からず、実用的じゃない。
|
|
30
30
|
[WinMerge](https://forest.watch.impress.co.jp/library/software/winmerge/) - Mac非対応のためテスト不可。
|
|
31
|
+
[Diff Checker](https://www.diffchecker.com/diff) - どういう処理をしているのかわからないが、左方に !important を入れたり、右方に書いてないセレクタを左方に書いても赤く表示されるので目的の機能ではない。
|
|
31
32
|
### 補足情報
|
|
32
33
|
作業環境はMac OSXです。
|
|
33
34
|
デフォルトCSSを取得することはできますが、削除することはできません。
|
3
実際に試したサービスを追記しています。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -26,9 +26,10 @@
|
|
|
26
26
|
[CSSO](https://css.github.io/csso/csso.html) - 項目が統合され、更に並び替えられてしまい、追加CSSの分だけ取り出すことが出来ず失敗。
|
|
27
27
|
[difff](https://difff.jp/) - 単純な文章の差分を探すサービスなので、重複しているスタイルなどは抽出できず失敗。
|
|
28
28
|
[CSS LINT](http://csslint.net/),[SYNCER](https://lab.syncer.jp/Tool/CSS-PrettyPrint/),[WebTools](http://tm-webtools.com/Tools/CssBeauty),[CSS Portal](https://www.cssportal.com/format-css/) - インデントや改行の整形機能のみだったため失敗。
|
|
29
|
-
|
|
29
|
+
[Pretty Diff](https://prettydiff.com/) - 英語かつ、構成が難解で、目的の機能を達成しているかどうかのテストすら難しい。実行結果のどこをコピーしていけば目的の部分を抽出できるのか分からず、実用的じゃない。
|
|
30
|
-
|
|
30
|
+
[WinMerge](https://forest.watch.impress.co.jp/library/software/winmerge/) - Mac非対応のためテスト不可。
|
|
31
31
|
### 補足情報
|
|
32
|
+
作業環境はMac OSXです。
|
|
32
33
|
デフォルトCSSを取得することはできますが、削除することはできません。
|
|
33
34
|
デフォルトCSSを追加CSSで上書きすることは出来るので、必要があれば日常的に上書きしています。
|
|
34
35
|
外部サイトに埋め込まれるHTMLタグは、ひとつひとつは小さいものですが、数は沢山あります。
|
2
実際に試したサービスを追記しています。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -22,6 +22,12 @@
|
|
|
22
22
|
整形ツールで統合してから、プロパティが無意味な文字になっている行だけ削除する、みたいな手法を考えてみたのですが、
|
|
23
23
|
それは最終的にただ単に追加CSSで（重複する部分も含めて）全て上書きするだけの結果になってしまい、時間を無駄にしてしまったことを後悔しています。
|
|
24
24
|
|
|
25
|
+
以下に具体的に試してみたサービスも追記します。(仕事中は見つけたものを手当たり次第試してたので、思い出せる範囲内ですが。)
|
|
26
|
+
[CSSO](https://css.github.io/csso/csso.html) - 項目が統合され、更に並び替えられてしまい、追加CSSの分だけ取り出すことが出来ず失敗。
|
|
27
|
+
[difff](https://difff.jp/) - 単純な文章の差分を探すサービスなので、重複しているスタイルなどは抽出できず失敗。
|
|
28
|
+
[CSS LINT](http://csslint.net/),[SYNCER](https://lab.syncer.jp/Tool/CSS-PrettyPrint/),[WebTools](http://tm-webtools.com/Tools/CssBeauty),[CSS Portal](https://www.cssportal.com/format-css/) - インデントや改行の整形機能のみだったため失敗。
|
|
29
|
+
|
|
30
|
+
|
|
25
31
|
### 補足情報
|
|
26
32
|
デフォルトCSSを取得することはできますが、削除することはできません。
|
|
27
33
|
デフォルトCSSを追加CSSで上書きすることは出来るので、必要があれば日常的に上書きしています。
|
1
「重複するプロパティを削除したい」から「重複する項目を削除したい」に変更しました。
title
CHANGED
|
@@ -1,1 +1,1 @@
|
|
|
1
|
-
CSS 既存のスタイルに重複する
|
|
1
|
+
CSS 既存のスタイルに重複する項目を削除したい。
|
body
CHANGED
|
@@ -7,8 +7,9 @@
|
|
|
7
7
|
このデフォルトCSSの仕組みが作られたのが最近で、その前は全て手書きCSSでスタイルを指定していたため、
|
|
8
8
|
過去作成されたCSSは、多くの部分がデフォルトCSSと重複しています。
|
|
9
9
|
|
|
10
|
-
保守性の向上のため、過去のCSSから、デフォルトCSSと重複している
|
|
10
|
+
保守性の向上のため、過去のCSSから、デフォルトCSSと重複している項目を削除する必要があるのですが、
|
|
11
|
+
この作業が全て目視と手作業で実行している状況です。
|
|
11
|
-
|
|
12
|
+
部分的にでも自動化して、取りこぼしの削減や、作業時間の短縮をしたいです。
|
|
12
13
|
よいツールや手法を教えてください。
|
|
13
14
|
|
|
14
15
|
### 試したこと
|