質問編集履歴
2
試したこと追記
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -154,9 +154,19 @@
|
|
|
154
154
|
###試したこと
|
|
155
155
|
- vender-prefix除去→効果なし
|
|
156
156
|
- gulp-ruby-sassをgulp-sassに変更→効果なし
|
|
157
|
+
- 不要プラグインをコメントアウト→効果なし
|
|
157
|
-
|
|
158
|
+
- package.jsonで全てのプラグインのヴァージョンをlatest指定→効果なし
|
|
158
|
-
|
|
159
|
+
- watchタスク部を以下のように書き換え→効果なし
|
|
159
160
|
|
|
161
|
+
```javascript
|
|
162
|
+
gulp.task('watch', ['gulp_sass'], function(){
|
|
163
|
+
var watcher = gulp.watch('./src/sass/**/*.scss', ['gulp_sass']);
|
|
164
|
+
watcher.on('change', function(event) {
|
|
165
|
+
console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');
|
|
166
|
+
});
|
|
167
|
+
});
|
|
168
|
+
```
|
|
169
|
+
|
|
160
170
|
###補足情報(言語/FW/ツール等のバージョンなど)
|
|
161
171
|
OS X El Capitan v10.11.6
|
|
162
172
|
node.js v6.9.2
|
1
不要プラグインを除去、表現を修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -2,10 +2,11 @@
|
|
|
2
2
|
gulpを用い、sassをcssにコンパイルするタスクを実行する際に正しくコンパイルされない不具合が発生しました。
|
|
3
3
|
|
|
4
4
|
###発生している問題・エラーメッセージ
|
|
5
|
-
- /scss直下のstyle.scssを更新した場合は、正常にコンパイルされるが
|
|
5
|
+
- src/scss直下のstyle.scssを更新した場合は、正常にコンパイルされるが
|
|
6
|
-
- /scss/core, /scss/layout, /scss/module配下のscssファイルを更新しても、
|
|
6
|
+
- src/scss/core, src/scss/layout, src/scss/module配下のscssファイルを更新しても、/dist/css/style.cssが更新されない（画面リロードは正常にする）。
|
|
7
7
|
- またその際ターミナル画面にエラーメッセージ等は出ない
|
|
8
8
|
|
|
9
|
+
|
|
9
10
|
###該当のソースコード
|
|
10
11
|
```javascript
|
|
11
12
|
/***************************************************************************
|
|
@@ -24,8 +25,7 @@
|
|
|
24
25
|
rename = require('gulp-rename'),
|
|
25
26
|
gulp_sass = require('gulp-sass'),
|
|
26
27
|
cache = require('gulp-cached'),
|
|
27
|
-
|
|
28
|
+
csscomb = require('gulp-csscomb'),
|
|
28
|
-
sprite = require('gulp.spritesmith'),
|
|
29
29
|
uglify = require('gulp-uglify')
|
|
30
30
|
;
|
|
31
31
|
|
|
@@ -47,11 +47,11 @@
|
|
|
47
47
|
'jsFiles' : 'src/js/**/*.js',
|
|
48
48
|
'jsDest' : 'dist/js',
|
|
49
49
|
// scss
|
|
50
|
-
'scssDest' : 'src/scss
|
|
50
|
+
'scssDest' : 'src/scss',
|
|
51
51
|
'scssFiles' : 'src/scss/**/*.scss',
|
|
52
52
|
// css
|
|
53
53
|
'cssDest' : 'dist/css'
|
|
54
|
-
}
|
|
54
|
+
};
|
|
55
55
|
|
|
56
56
|
// Static server
|
|
57
57
|
gulp.task('browser-sync', function() {
|
|
@@ -65,24 +65,13 @@
|
|
|
65
65
|
|
|
66
66
|
// Reload all browsers
|
|
67
67
|
gulp.task('bs-reload', function() {
|
|
68
|
-
browserSync.reload()
|
|
68
|
+
browserSync.reload();
|
|
69
69
|
});
|
|
70
70
|
|
|
71
71
|
/***************************************************************************
|
|
72
72
|
* image tasks
|
|
73
73
|
***************************************************************************/
|
|
74
74
|
|
|
75
|
-
gulp.task('sprite', function() {
|
|
76
|
-
var spriteData = gulp.src(paths.imgDir + '/sprite/*.png')
|
|
77
|
-
.pipe(sprite({
|
|
78
|
-
imgName: 'sprite.png',
|
|
79
|
-
imgPath: '/' + paths.imgDest + '/sprite.png',
|
|
80
|
-
cssName: '_module-sprite.scss'
|
|
81
|
-
}));
|
|
82
|
-
spriteData.img.pipe(gulp.dest(paths.imgDest));
|
|
83
|
-
spriteData.css.pipe(gulp.dest(paths.scssDest + '/module'));
|
|
84
|
-
});
|
|
85
|
-
|
|
86
75
|
/***************************************************************************
|
|
87
76
|
* js tasks
|
|
88
77
|
***************************************************************************/
|
|
@@ -110,7 +99,8 @@
|
|
|
110
99
|
}))
|
|
111
100
|
.pipe(csscomb())
|
|
112
101
|
.pipe(autoprefixer("last 2 version"))
|
|
113
|
-
.pipe(gulp.dest(paths.cssDest))
|
|
102
|
+
//.pipe(gulp.dest(paths.cssDest))
|
|
103
|
+
.pipe(gulp.dest('dist/css'))
|
|
114
104
|
.pipe(reload({ stream: true }));
|
|
115
105
|
});
|
|
116
106
|
/***************************************************************************
|
|
@@ -118,20 +108,19 @@
|
|
|
118
108
|
***************************************************************************/
|
|
119
109
|
|
|
120
110
|
gulp.task('watch', function() {
|
|
121
|
-
gulp.watch([paths.imgDest + '/sprite/*.png'], ['sprite']);
|
|
122
|
-
gulp.watch([paths.htmlFiles], ['bs-reload']);
|
|
111
|
+
gulp.watch([paths.htmlFiles], ['bs-reload']).on('change', reload);
|
|
123
|
-
gulp.watch([paths.jsDest], ['jsLib']);
|
|
112
|
+
gulp.watch([paths.jsDest], ['jsLib']).on('change', reload);
|
|
124
|
-
gulp.watch([paths.scssFiles], ['gulp_sass']);
|
|
113
|
+
gulp.watch([paths.scssFiles], ['gulp_sass']).on('change', reload);
|
|
125
114
|
});
|
|
126
115
|
|
|
127
116
|
gulp.task('default', [
|
|
128
117
|
'browser-sync',
|
|
118
|
+
'gulp_sass',
|
|
129
119
|
'bs-reload',
|
|
130
120
|
'jsLib',
|
|
131
|
-
'gulp_sass',
|
|
132
|
-
'sprite',
|
|
133
121
|
'watch'
|
|
134
122
|
]);
|
|
123
|
+
|
|
135
124
|
```
|
|
136
125
|
```scss
|
|
137
126
|
@charset "utf-8";
|