{"id":661,"date":"2018-10-17T20:36:13","date_gmt":"2018-10-17T11:36:13","guid":{"rendered":"https:\/\/www.dogrow.net\/hp\/?p=661"},"modified":"2021-01-08T09:30:07","modified_gmt":"2021-01-08T00:30:07","slug":"blog64","status":"publish","type":"post","link":"https:\/\/www.dogrow.net\/hp\/blog64\/","title":{"rendered":"(64) \u3010Sass\u5165\u9580#4\u3011Windows10\u3067\u3082sass\u3092\u4f7f\u3046\u3002"},"content":{"rendered":"<h1 class=\"my_h\">1. \u3084\u308a\u305f\u3044\u3053\u3068<\/h1>\n<p>\u3044\u3064\u3082\u306f Linux\u4e0a\u3067 sass\u3092\u5b9f\u884c\u3057\u3066\u3044\u308b\u304c\u3001\u305f\u307e\u306b Windows\u4e0a\u3067\u5b9f\u884c\u3057\u305f\u3044\u6642\u3082\u3042\u308b\u3002<\/p>\n<h1 class=\"my_h\">2. \u3084\u3063\u3066\u307f\u308b<\/h1>\n<h2 class=\"my_h\">(1) Ruby\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3002<\/h2>\n<p>\u3053\u3061\u3089\u304b\u3089 Windows\u7528\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30e9\u3092\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3057\u3001\u5b9f\u884c\u3059\u308b\u3002<br \/>\n<a href=\"https:\/\/rubyinstaller.org\/downloads\/\" target=\"_blank\" rel=\"noopener\">https:\/\/rubyinstaller.org\/downloads\/<\/a><\/p>\n<p>\u3046\u3061\u306eWindows\u30d1\u30bd\u30b3\u30f3\u306e CPU\u306f Core i7 8700 \u306a\u306e\u3067 x64\u7248\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30e9\u3092\u4f7f\u3046\u3002<br \/>\n\u4eca\u56de\u306f 2018\u5e7410\u670817\u65e5\u6642\u70b9\u306e\u6700\u65b0\u7248\u3067\u3042\u308b Ruby 2.5.1-2 (x64) \u3092\u30c0\u30a6\u30f3\u30ed\u30fc\u30c9\u3057\u305f\u3002<\/p>\n<h2 class=\"my_h\">(2) sass\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3002<\/h2>\n<p>\u30b3\u30de\u30f3\u30c9\u30d7\u30ed\u30f3\u30d7\u30c8\u3067\u4ee5\u4e0b\u3092\u5b9f\u884c\u3059\u308b\u3002\u5b9f\u884c\u5834\u6240\u306f\u3069\u3053\u3067\u3082\u3088\u3044\u3002<\/p>\n<pre>\r\ngem install sass\r\nsass -v\r\ngem update sass\r\nsass -v\r\n<\/pre>\n<h2 class=\"my_h\">(3) sass\u3092\u5b9f\u884c\u3059\u308b\u3002<\/h2>\n<p>sass\u30d5\u30a1\u30a4\u30eb\u306e\u5b58\u5728\u3059\u308b\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3067\u5b9f\u884c\u3057\u3066\u307f\u308b\u3002<br \/>\n\u3053\u3053\u3067\u306f compressed\u6307\u5b9a\u3067 minify\u3059\u308b\u3002<\/p>\n<pre>\r\nsass -t compressed style.scss:style.css\r\n<\/pre>\n<h1 class=\"my_h\">3. \u5fdc\u7528<\/h1>\n<h2 class=\"my_h\">(1) \u30d0\u30c3\u30c1\u30d5\u30a1\u30a4\u30eb\u3067\u81ea\u52d5\u5b9f\u884c\u3059\u308b\u3002<\/h2>\n<h3 class=\"my_h\">Step 1: \u5358\u7d14\u306b sass\u3060\u3051\u3092\u5b9f\u884c\u3059\u308b\u3002<\/h3>\n<p>Sass\u3067 scss\u3092 minify\u3057\u305f css\u30d5\u30a1\u30a4\u30eb\u3092\u4f5c\u308b\u3002<br \/>\n\u3053\u306e\u5834\u5408\u3001scss\u3068\u540c\u3058\u30d5\u30a9\u30eb\u30c0\u306b css\u30d5\u30a1\u30a4\u30eb\u304c\u751f\u6210\u3055\u308c\u308b\u3002<\/p>\n<pre>\r\nsass -t compressed style.scss:style.css\r\n<\/pre>\n<p>\u3053\u306e\u307e\u307e\u3060\u3068\u81ea\u52d5\u3067 map\u30d5\u30a1\u30a4\u30eb\u304c\u51fa\u529b\u3055\u308c\u308b\u3002<br \/>\n\u666e\u6bb5\u306f\u4e0d\u5fc5\u8981\u306a\u306e\u3067\u3001map\u30d5\u30a1\u30a4\u30eb\u3092\u751f\u6210\u3057\u306a\u3044\u3088\u3046\u306b <span class=\"my_fc_deeppink\">&#8211;sourcemap=false<\/span> \u6307\u5b9a\u3067\u51fa\u529b\u3092\u6291\u5236\u3059\u308b\u3002<\/p>\n<pre>\r\nsass -t compressed <span class=\"my_fc_deeppink\">--sourcemap=false<\/span> style.scss:style.css\r\n<\/pre>\n<h3 class=\"my_h\">Step 2: SASS\u3092\u5b9f\u884c\u3057\u3001\u751f\u6210\u3057\u305fcss\u3092\u5225\u30d5\u30a9\u30eb\u30c0\u306b\u79fb\u52d5\u3059\u308b\u3002<\/h3>\n<p>\u30b7\u30ca\u30ea\u30aa\u306f\u4ee5\u4e0b\u306e\u901a\u308a\u3002<br \/>\n1) Sass\u3067 scss\u3092 minify\u3057\u305f css\u30d5\u30a1\u30a4\u30eb\u3092\u4f5c\u308b\u3002<br \/>\n2) \u51fa\u6765\u4e0a\u304c\u3063\u305f css\u30d5\u30a1\u30a4\u30eb\u3092\u304a\u96a3\u306e css\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u79fb\u52d5\u3059\u308b\u3002<\/p>\n<p><span class=\"my_fc_crimson\">\uff06\u3067\u7e4b\u3052\u306a\u3044\u3068\uff11\u30b3\u30de\u30f3\u30c9\u7d42\u4e86\u6642\u306b\u30d0\u30c3\u30c1\u51e6\u7406\u3082\u7d42\u4e86\u3057\u3066\u3057\u307e\u3046\u306e\u3067\u6ce8\u610f\u3002<\/span><\/p>\n<pre>\r\nsass -t compressed --sourcemap=none style.scss:style.css & move style.css ..\/css\r\n<\/pre>\n<h3 class=\"my_h\">Step 3: \u4e0a\u8a18\u306e Step2\u3092\u8907\u6570\u306e scss\u30d5\u30a1\u30a4\u30eb\u306b\u5bfe\u3057\u3066\u5b9f\u884c\u3059\u308b\u3002<\/h3>\n<p>\u30b7\u30ca\u30ea\u30aa\u306f\u4ee5\u4e0b\u306e\u901a\u308a\u3002<br \/>\n1) Sass\u3067\u8907\u6570\u306e scss\u30d5\u30a1\u30a4\u30eb\u3092 minify\u3057\u305f css\u30d5\u30a1\u30a4\u30eb\u3092\u4f5c\u308b\u3002<br \/>\n2) \u51fa\u6765\u4e0a\u304c\u3063\u305f css\u30d5\u30a1\u30a4\u30eb\u3092\u304a\u96a3\u306e css\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u79fb\u52d5\u3059\u308b\u3002<\/p>\n<p>\u30d0\u30c3\u30c1\u30d5\u30a1\u30a4\u30eb\u306e\u4e2d\u3067\u8907\u6570\u30b3\u30de\u30f3\u30c9\u3092\u4e26\u3079\u3066\u66f8\u3051\u3070\u3088\u3044\u3002<br \/>\n\u30b3\u30de\u30f3\u30c9\u3092\u6a2a\u306b\u3064\u306a\u3052\u3066\u9577\u304f\u306a\u308b\u3068\u898b\u3065\u3089\u3044\u306e\u3067<br \/>\n\u6539\u884c\u3059\u308b\u5834\u5408\u3001\u884c\u672b\u306b <span class=\"my_fc_deeppinkBBig\">^<\/span> \u3092\u4ed8\u3051\u308b\u3068 1\u884c\u306b\u5c55\u958b\u3057\u3066\u5b9f\u884c\u3055\u308c\u308b\u3002<\/p>\n<pre>\r\nsass -t compressed --sourcemap=none reset.scss:reset.css & ^\r\nsass -t compressed --sourcemap=none style.scss:style.css & ^\r\nmove *.css ..\/css\r\n<\/pre>\n<hr class=\"my_hr_bottom\">\n","protected":false},"excerpt":{"rendered":"<p>1. \u3084\u308a\u305f\u3044\u3053\u3068 \u3044\u3064\u3082\u306f Linux\u4e0a\u3067 sass\u3092\u5b9f\u884c\u3057\u3066\u3044\u308b\u304c\u3001\u305f\u307e\u306b Windows\u4e0a\u3067\u5b9f\u884c\u3057\u305f\u3044\u6642\u3082\u3042\u308b\u3002 2. \u3084\u3063\u3066\u307f\u308b (1) Ruby\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3059\u308b\u3002 \u3053\u3061\u3089\u304b\u3089 Windows\u7528\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30e9\u3092\u2026 <span class=\"read-more\"><a href=\"https:\/\/www.dogrow.net\/hp\/blog64\/\">\u7d9a\u304d\u3092\u8aad\u3080 &raquo;<\/a><\/span><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[19],"tags":[],"class_list":["post-661","post","type-post","status-publish","format-standard","hentry","category-sass"],"views":1809,"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/posts\/661","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/comments?post=661"}],"version-history":[{"count":9,"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/posts\/661\/revisions"}],"predecessor-version":[{"id":1398,"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/posts\/661\/revisions\/1398"}],"wp:attachment":[{"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/media?parent=661"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/categories?post=661"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.dogrow.net\/hp\/wp-json\/wp\/v2\/tags?post=661"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}