Showing
14 changed files
with
326 additions
and
320 deletions
static/gulpfile-new.js
deleted
100644 → 0
1 | -/** | ||
2 | - * GULP-FILE | ||
3 | - * author: xuqi(qi.xu@yoho.cn) | ||
4 | - * date: 2015/9/30 | ||
5 | - * 根据 PC 版修改为 H5 版, 毕凯 | ||
6 | - */ | ||
7 | - | ||
8 | -var gulp = require('gulp'), | ||
9 | - cp = require('child_process'); | ||
10 | - | ||
11 | -var fs = require('fs'), | ||
12 | - ftp = require('gulp-ftp'), | ||
13 | - gutil = require('gulp-util'), | ||
14 | - uglify = require('gulp-uglify'), | ||
15 | - Package = require('father').SpmPackage, | ||
16 | - transport = require('gulp-spm'), | ||
17 | - concat = require('gulp-concat'); | ||
18 | - | ||
19 | -var postcss = require('gulp-postcss'); | ||
20 | -var sourcemaps = require('gulp-sourcemaps'); | ||
21 | -var cssnano = require('gulp-cssnano'); | ||
22 | - | ||
23 | -var config = require('./package'); | ||
24 | - | ||
25 | -var rootDist = 'dist/myohobuy/', | ||
26 | - ftpConfig = { | ||
27 | - host: '218.94.75.58', | ||
28 | - user: 'php', | ||
29 | - pass: 'yoho9646' | ||
30 | - }; | ||
31 | - | ||
32 | -var distDir = { | ||
33 | - js: rootDist + config.version, | ||
34 | - css: rootDist + config.version, | ||
35 | - img: rootDist + 'assets/img', | ||
36 | - font: rootDist + 'assets/font' | ||
37 | -}; | ||
38 | - | ||
39 | -gulp.task('default', ['postcss-dev', 'postcss-watch', 'spm-doc']); | ||
40 | - | ||
41 | - | ||
42 | -//根据环境变量生成postcss插件配置 | ||
43 | -function postcssEnvPlugin(env) { | ||
44 | - var sprites = { | ||
45 | - spritesmith: { | ||
46 | - padding: 10 | ||
47 | - }, | ||
48 | - groupBy: function(file) { | ||
49 | - | ||
50 | - // 根据目录分组,防止合并后的图片太大 | ||
51 | - var group = file.url.split('/')[1]; | ||
52 | - | ||
53 | - file.retina = true; // H5 强制所有图片都是用二倍图 | ||
54 | - return group ? Promise.resolve(group) : Promise.reject(); | ||
55 | - }, | ||
56 | - filterBy: function(file) { | ||
57 | - | ||
58 | - //使用resolve转化后静态资源生成../img或者../assets/img/的路径 | ||
59 | - if (/\/img/.test(file.url) || /data:image/.test(file.url)) { | ||
60 | - return Promise.reject(); | ||
61 | - } | ||
62 | - return Promise.resolve(); | ||
63 | - } | ||
64 | - }, | ||
65 | - assets; | ||
66 | - | ||
67 | - if (env === 'DEV') { | ||
68 | - assets = { | ||
69 | - loadPaths: ['font/', 'img/'], | ||
70 | - relativeTo: 'css/' | ||
71 | - }; | ||
72 | - | ||
73 | - Object.assign(sprites, { | ||
74 | - basePath: './img', | ||
75 | - stylesheetPath: './css', | ||
76 | - spritePath: './img' | ||
77 | - }); | ||
78 | - } else if (env === 'PRO') { | ||
79 | - assets = { | ||
80 | - loadPaths: [distDir.img, distDir.font], | ||
81 | - relativeTo: distDir.css, | ||
82 | - cachebuster: function(filePath, urlPathname) { | ||
83 | - | ||
84 | - //只给字体加no-cache | ||
85 | - if (/font\//.test(urlPathname)) { | ||
86 | - return fs.statSync(filePath).mtime.getTime().toString(16); | ||
87 | - } | ||
88 | - } | ||
89 | - }; | ||
90 | - | ||
91 | - Object.assign(sprites, { | ||
92 | - basePath: distDir.img, | ||
93 | - stylesheetPath: distDir.css, | ||
94 | - spritePath: distDir.img | ||
95 | - }); | ||
96 | - } | ||
97 | - | ||
98 | - return [ | ||
99 | - require('precss'), | ||
100 | - require('postcss-assets')(assets), | ||
101 | - require('postcss-sprites').default(sprites), | ||
102 | - require('postcss-calc'), | ||
103 | - require('postcss-pxtorem')({ | ||
104 | - rootValue: 40, | ||
105 | - unitPrecision: 5, // 保留5位小数字 | ||
106 | - minPixelValue: 2, // 小于 2px 时,不转换, 单位为 PX 大写的时候不转换 | ||
107 | - selectorBlackList: [], // 选择器黑名单,可以使用正则 | ||
108 | - propWhiteList: [] // 属性名称为空,表示替换所有属性的值 | ||
109 | - }), | ||
110 | - require('autoprefixer')({ | ||
111 | - browsers: ['> 1%'] | ||
112 | - }), | ||
113 | - | ||
114 | - //可选 | ||
115 | - require('postcss-use')({ | ||
116 | - modules: ['postcss-clearfix', 'postcss-crip', 'postcss-short', 'postcss-center', 'postcss-position'] | ||
117 | - }) | ||
118 | - ]; | ||
119 | -} | ||
120 | - | ||
121 | -//Postcss开发环境 | ||
122 | -gulp.task('postcss-dev', function() { | ||
123 | - return gulp.src('sass/index.css') | ||
124 | - .pipe(sourcemaps.init()) | ||
125 | - .pipe(postcss(postcssEnvPlugin('DEV'))) | ||
126 | - .pipe(sourcemaps.write('.')) | ||
127 | - .pipe(gulp.dest('css/')) | ||
128 | -}); | ||
129 | - | ||
130 | -gulp.task('postcss-watch', function() { | ||
131 | - gulp.watch('sass/**/*.css', ['postcss-dev']); | ||
132 | -}); | ||
133 | - | ||
134 | -//Postcss正式环境生成 | ||
135 | -gulp.task('postcss-pro', ['assets'], function() { | ||
136 | - return gulp.src('sass/index.css') | ||
137 | - .pipe(postcss(postcssEnvPlugin('PRO'))) | ||
138 | - .pipe(cssnano()) | ||
139 | - .pipe(gulp.dest(distDir.css)) | ||
140 | -}); | ||
141 | - | ||
142 | -// start spm server | ||
143 | -gulp.task('spm-doc', function() { | ||
144 | - var sd = cp.exec('spm doc watch --port 8000'); // PC 用8001,H5 用8000, 跑两个服务器,不冲突 | ||
145 | - | ||
146 | - // sd.stdout.on('data', function(data) { | ||
147 | - // console.log(data); | ||
148 | - // }); | ||
149 | - | ||
150 | - sd.stderr.on('data', function(data) { | ||
151 | - console.log(data); | ||
152 | - }); | ||
153 | - | ||
154 | - sd.on('exit', function(code) { | ||
155 | - console.log('process spm doc exit with code ' + code); | ||
156 | - }); | ||
157 | -}); | ||
158 | - | ||
159 | -//生成发布目录,可用于上传测试机 | ||
160 | -gulp.task('ge', ['assets', 'postcss-pro', 'build']); | ||
161 | - | ||
162 | -//发布 | ||
163 | -gulp.task('dist', ['assets', 'postcss-pro', 'build'], function() { | ||
164 | - var ftpstream = ftp(ftpConfig); | ||
165 | - | ||
166 | - return gulp.src('dist/**/') | ||
167 | - .pipe(ftpstream) | ||
168 | - .pipe(gutil.noop()); | ||
169 | -}); | ||
170 | - | ||
171 | -//font+img->dist/assets | ||
172 | -gulp.task('assets', ['img', 'font']); | ||
173 | - | ||
174 | -gulp.task('img', function() { | ||
175 | - return gulp.src('img/**/*') | ||
176 | - .pipe(gulp.dest(distDir.img)); | ||
177 | -}); | ||
178 | - | ||
179 | -gulp.task('font', function() { | ||
180 | - return gulp.src('font/*') | ||
181 | - .pipe(gulp.dest(distDir.font)) | ||
182 | -}); | ||
183 | - | ||
184 | -//spm build | ||
185 | -gulp.task('build', ['libs', 'business']); | ||
186 | - | ||
187 | -//libs | ||
188 | -gulp.task('libs', ['pre-libs', 'concat-min-libs', 'clear-libs']); | ||
189 | - | ||
190 | -gulp.task('pre-libs', function() { | ||
191 | - var obj = { | ||
192 | - name: '', | ||
193 | - version: config.version, | ||
194 | - spm: config.spm | ||
195 | - }; | ||
196 | - var packages = [], | ||
197 | - libsjs = ''; | ||
198 | - | ||
199 | - var libCon, key, i; | ||
200 | - | ||
201 | - var pkg; | ||
202 | - | ||
203 | - obj.spm.main = 'libs.js'; | ||
204 | - obj.spm.buildArgs = '--idleading {{}} --include all'; | ||
205 | - | ||
206 | - libCon = JSON.stringify(obj); | ||
207 | - | ||
208 | - fs.renameSync('package.json', 'package.bak.json'); | ||
209 | - fs.writeFileSync('package.json', libCon); | ||
210 | - | ||
211 | - for (key in obj.spm.dependencies) { | ||
212 | - if (obj.spm.inside && obj.spm.inside[key]) { | ||
213 | - packages.push(obj.spm.inside[key]); | ||
214 | - } else { | ||
215 | - packages.push(key); | ||
216 | - } | ||
217 | - } | ||
218 | - | ||
219 | - for (i = 0; i < packages.length; i++) { | ||
220 | - libsjs += 'require("' + packages[i] + '");'; | ||
221 | - } | ||
222 | - | ||
223 | - fs.writeFileSync('libs.js', libsjs); //重写入口文件 | ||
224 | - | ||
225 | - pkg = new Package(__dirname); | ||
226 | - | ||
227 | - return gulp.src(pkg.main) | ||
228 | - .pipe(transport({ | ||
229 | - pkg: pkg | ||
230 | - })) | ||
231 | - .pipe(gulp.dest(distDir.js)); | ||
232 | -}); | ||
233 | - | ||
234 | -gulp.task('concat-min-libs', ['pre-libs'], function() { | ||
235 | - var path = distDir.js + '/libs.js'; | ||
236 | - var jsStr = fs.readFileSync(path).toString(); | ||
237 | - | ||
238 | - fs.writeFileSync(path, jsStr.substr(jsStr.indexOf('});') + 4)); | ||
239 | - | ||
240 | - return gulp.src(['js/plugin/sea.js', distDir.js + '/libs.js']) | ||
241 | - .pipe(concat('lib.js')) | ||
242 | - .pipe(uglify()) | ||
243 | - .pipe(gulp.dest(distDir.js)); | ||
244 | -}); | ||
245 | - | ||
246 | -gulp.task('clear-libs', ['concat-min-libs'], function() { | ||
247 | - fs.renameSync('package.bak.json', 'package.json'); | ||
248 | - fs.unlinkSync('./libs.js'); | ||
249 | - fs.unlinkSync(distDir.js + '/libs.js'); | ||
250 | -}); | ||
251 | - | ||
252 | -gulp.task('business', ['libs'], function() { | ||
253 | - var pkg = new Package(__dirname); | ||
254 | - | ||
255 | - return gulp.src(pkg.main) | ||
256 | - .pipe(transport({ | ||
257 | - pkg: pkg | ||
258 | - })) | ||
259 | - .pipe(concat('index-debug.js')) | ||
260 | - .pipe(gulp.dest(distDir.js)) | ||
261 | - .pipe(uglify()) | ||
262 | - .pipe(concat('index.js')) | ||
263 | - .pipe(gulp.dest(distDir.js)); | ||
264 | -}); |
static/gulpfile-old.js
0 → 100644
1 | +/** | ||
2 | + * GULP-FILE | ||
3 | + * author: xuqi(qi.xu@yoho.cn) | ||
4 | + * date: 2015/9/30 | ||
5 | + */ | ||
6 | + | ||
7 | +var gulp = require('gulp'), | ||
8 | + compass = require('gulp-compass'), | ||
9 | + cp = require('child_process'); | ||
10 | + | ||
11 | +var fs = require('fs'), | ||
12 | + ftp = require('gulp-ftp'), | ||
13 | + gutil = require('gulp-util'), | ||
14 | + uglify = require('gulp-uglify'), | ||
15 | + Package = require('father').SpmPackage, | ||
16 | + transport = require('gulp-spm'), | ||
17 | + concat = require('gulp-concat'); | ||
18 | + | ||
19 | +var config = JSON.parse(fs.readFileSync('./package.json').toString()); | ||
20 | + | ||
21 | +var rootDist = 'dist/myohobuy/', | ||
22 | + ftpConfig = { | ||
23 | + host: '218.94.75.58', | ||
24 | + user: 'php', | ||
25 | + pass: 'yoho9646' | ||
26 | + }; | ||
27 | + | ||
28 | +var distDir = { | ||
29 | + js: rootDist + config.version, | ||
30 | + css: rootDist + config.version, | ||
31 | + img: rootDist + 'assets/img', | ||
32 | + font: rootDist + 'assets/font' | ||
33 | +}; | ||
34 | + | ||
35 | +gulp.task('default', ['compass', 'compass-watch', 'spm-doc']); | ||
36 | + | ||
37 | +// compass | ||
38 | +gulp.task('compass', function() { | ||
39 | + gulp.src('sass/**/*.scss') | ||
40 | + .pipe( | ||
41 | + compass({ | ||
42 | + config_file: 'config.rb', | ||
43 | + css: 'css', | ||
44 | + sass: 'sass' | ||
45 | + }) | ||
46 | + ).on('error', function(error) { | ||
47 | + console.log(error); | ||
48 | + this.emit('end'); | ||
49 | + }); | ||
50 | +}); | ||
51 | + | ||
52 | +// compass watch | ||
53 | +gulp.task('compass-watch', function() { | ||
54 | + gulp.watch('sass/**/*.scss', ['compass']); | ||
55 | +}); | ||
56 | + | ||
57 | +// start spm server | ||
58 | +gulp.task('spm-doc', function() { | ||
59 | + var sd = cp.exec('spm doc'); | ||
60 | + | ||
61 | + // sd.stdout.on('data', function(data) { | ||
62 | + // console.log(data); | ||
63 | + // }); | ||
64 | + | ||
65 | + sd.stderr.on('data', function(data) { | ||
66 | + console.log(data); | ||
67 | + }); | ||
68 | + | ||
69 | + sd.on('exit', function(code) { | ||
70 | + console.log('process spm doc exit with code ' + code); | ||
71 | + }); | ||
72 | +}); | ||
73 | + | ||
74 | +//生成发布目录,可用于上传测试机 | ||
75 | +gulp.task('ge', ['assets', 'compass-production', 'build']); | ||
76 | + | ||
77 | +//发布 | ||
78 | +gulp.task('dist', ['assets', 'compass-production', 'build'], function() { | ||
79 | + var ftpstream = ftp(ftpConfig); | ||
80 | + | ||
81 | + return gulp.src('dist/**/') | ||
82 | + .pipe(ftpstream) | ||
83 | + .pipe(gutil.noop()); | ||
84 | +}); | ||
85 | + | ||
86 | +//font+img->dist/assets | ||
87 | +gulp.task('assets', function() { | ||
88 | + gulp.src('img/**') | ||
89 | + .pipe(gulp.dest(distDir.img)); | ||
90 | + gulp.src('font/*') | ||
91 | + .pipe(gulp.dest(distDir.font)); | ||
92 | +}); | ||
93 | + | ||
94 | +//compass | ||
95 | +gulp.task('compass-production', ['assets'], function() { | ||
96 | + gulp.src('sass/index.scss') | ||
97 | + .pipe( | ||
98 | + compass({ | ||
99 | + css: distDir.css, | ||
100 | + sass: 'sass', | ||
101 | + image: distDir.img, | ||
102 | + font: distDir.font, | ||
103 | + http_path: '/', | ||
104 | + style: 'compressed' | ||
105 | + }) | ||
106 | + ) | ||
107 | + .on('error', function(error) { | ||
108 | + console.log(error); | ||
109 | + this.emit('end'); | ||
110 | + }); | ||
111 | +}); | ||
112 | + | ||
113 | +//spm build | ||
114 | +gulp.task('build', ['libs', 'business']); | ||
115 | + | ||
116 | +//libs | ||
117 | +gulp.task('libs', ['pre-libs', 'concat-min-libs', 'clear-libs']); | ||
118 | + | ||
119 | +gulp.task('pre-libs', function() { | ||
120 | + var obj = { | ||
121 | + name: '', | ||
122 | + version: config.version, | ||
123 | + spm: config.spm | ||
124 | + }; | ||
125 | + var packages = [], | ||
126 | + libsjs = ''; | ||
127 | + | ||
128 | + var libCon, key, i; | ||
129 | + | ||
130 | + var pkg; | ||
131 | + | ||
132 | + obj.spm.main = 'libs.js'; | ||
133 | + obj.spm.buildArgs = '--idleading {{}} --include all'; | ||
134 | + | ||
135 | + libCon = JSON.stringify(obj); | ||
136 | + | ||
137 | + fs.renameSync('package.json', 'package.bak.json'); | ||
138 | + fs.writeFileSync('package.json', libCon); | ||
139 | + | ||
140 | + for (key in obj.spm.dependencies) { | ||
141 | + if (obj.spm.inside && obj.spm.inside[key]) { | ||
142 | + packages.push(obj.spm.inside[key]); | ||
143 | + } else { | ||
144 | + packages.push(key); | ||
145 | + } | ||
146 | + } | ||
147 | + | ||
148 | + for (i = 0; i < packages.length; i++) { | ||
149 | + libsjs += 'require("' + packages[i] + '");'; | ||
150 | + } | ||
151 | + | ||
152 | + fs.writeFileSync('libs.js', libsjs); //重写入口文件 | ||
153 | + | ||
154 | + pkg = new Package(__dirname); | ||
155 | + | ||
156 | + return gulp.src(pkg.main) | ||
157 | + .pipe(transport({ | ||
158 | + pkg: pkg | ||
159 | + })) | ||
160 | + .pipe(gulp.dest(distDir.js)); | ||
161 | +}); | ||
162 | + | ||
163 | +gulp.task('concat-min-libs', ['pre-libs'], function() { | ||
164 | + var path = distDir.js + '/libs.js'; | ||
165 | + var jsStr = fs.readFileSync(path).toString(); | ||
166 | + | ||
167 | + fs.writeFileSync(path, jsStr.substr(jsStr.indexOf('});') + 4)); | ||
168 | + | ||
169 | + return gulp.src(['js/plugin/sea.js', distDir.js + '/libs.js']) | ||
170 | + .pipe(concat('lib.js')) | ||
171 | + .pipe(uglify()) | ||
172 | + .pipe(gulp.dest(distDir.js)); | ||
173 | +}); | ||
174 | + | ||
175 | +gulp.task('clear-libs', ['concat-min-libs'], function() { | ||
176 | + fs.renameSync('package.bak.json', 'package.json'); | ||
177 | + fs.unlinkSync('./libs.js'); | ||
178 | + fs.unlinkSync(distDir.js + '/libs.js'); | ||
179 | +}); | ||
180 | + | ||
181 | +gulp.task('business', ['libs'], function() { | ||
182 | + var pkg = new Package(__dirname); | ||
183 | + | ||
184 | + return gulp.src(pkg.main) | ||
185 | + .pipe(transport({ | ||
186 | + pkg: pkg | ||
187 | + })) | ||
188 | + .pipe(concat('index-debug.js')) | ||
189 | + .pipe(gulp.dest(distDir.js)) | ||
190 | + .pipe(uglify()) | ||
191 | + .pipe(concat('index.js')) | ||
192 | + .pipe(gulp.dest(distDir.js)); | ||
193 | +}); |
@@ -2,10 +2,10 @@ | @@ -2,10 +2,10 @@ | ||
2 | * GULP-FILE | 2 | * GULP-FILE |
3 | * author: xuqi(qi.xu@yoho.cn) | 3 | * author: xuqi(qi.xu@yoho.cn) |
4 | * date: 2015/9/30 | 4 | * date: 2015/9/30 |
5 | + * 根据 PC 版修改为 H5 版, 毕凯 | ||
5 | */ | 6 | */ |
6 | 7 | ||
7 | var gulp = require('gulp'), | 8 | var gulp = require('gulp'), |
8 | - compass = require('gulp-compass'), | ||
9 | cp = require('child_process'); | 9 | cp = require('child_process'); |
10 | 10 | ||
11 | var fs = require('fs'), | 11 | var fs = require('fs'), |
@@ -16,7 +16,11 @@ var fs = require('fs'), | @@ -16,7 +16,11 @@ var fs = require('fs'), | ||
16 | transport = require('gulp-spm'), | 16 | transport = require('gulp-spm'), |
17 | concat = require('gulp-concat'); | 17 | concat = require('gulp-concat'); |
18 | 18 | ||
19 | -var config = JSON.parse(fs.readFileSync('./package.json').toString()); | 19 | +var postcss = require('gulp-postcss'); |
20 | +var sourcemaps = require('gulp-sourcemaps'); | ||
21 | +var cssnano = require('gulp-cssnano'); | ||
22 | + | ||
23 | +var config = require('./package'); | ||
20 | 24 | ||
21 | var rootDist = 'dist/myohobuy/', | 25 | var rootDist = 'dist/myohobuy/', |
22 | ftpConfig = { | 26 | ftpConfig = { |
@@ -32,31 +36,112 @@ var distDir = { | @@ -32,31 +36,112 @@ var distDir = { | ||
32 | font: rootDist + 'assets/font' | 36 | font: rootDist + 'assets/font' |
33 | }; | 37 | }; |
34 | 38 | ||
35 | -gulp.task('default', ['compass', 'compass-watch', 'spm-doc']); | 39 | +gulp.task('default', ['postcss-dev', 'postcss-watch', 'spm-doc']); |
36 | 40 | ||
37 | -// compass | ||
38 | -gulp.task('compass', function() { | ||
39 | - gulp.src('sass/**/*.scss') | ||
40 | - .pipe( | ||
41 | - compass({ | ||
42 | - config_file: 'config.rb', | ||
43 | - css: 'css', | ||
44 | - sass: 'sass' | ||
45 | - }) | ||
46 | - ).on('error', function(error) { | ||
47 | - console.log(error); | ||
48 | - this.emit('end'); | 41 | + |
42 | +//根据环境变量生成postcss插件配置 | ||
43 | +function postcssEnvPlugin(env) { | ||
44 | + var sprites = { | ||
45 | + spritesmith: { | ||
46 | + padding: 10 | ||
47 | + }, | ||
48 | + groupBy: function(file) { | ||
49 | + | ||
50 | + // 根据目录分组,防止合并后的图片太大 | ||
51 | + var group = file.url.split('/')[1]; | ||
52 | + | ||
53 | + file.retina = true; // H5 强制所有图片都是用二倍图 | ||
54 | + return group ? Promise.resolve(group) : Promise.reject(); | ||
55 | + }, | ||
56 | + filterBy: function(file) { | ||
57 | + | ||
58 | + //使用resolve转化后静态资源生成../img或者../assets/img/的路径 | ||
59 | + if (/\/img/.test(file.url) || /data:image/.test(file.url)) { | ||
60 | + return Promise.reject(); | ||
61 | + } | ||
62 | + return Promise.resolve(); | ||
63 | + } | ||
64 | + }, | ||
65 | + assets; | ||
66 | + | ||
67 | + if (env === 'DEV') { | ||
68 | + assets = { | ||
69 | + loadPaths: ['font/', 'img/'], | ||
70 | + relativeTo: 'css/' | ||
71 | + }; | ||
72 | + | ||
73 | + Object.assign(sprites, { | ||
74 | + basePath: './img', | ||
75 | + stylesheetPath: './css', | ||
76 | + spritePath: './img' | ||
49 | }); | 77 | }); |
78 | + } else if (env === 'PRO') { | ||
79 | + assets = { | ||
80 | + loadPaths: [distDir.img, distDir.font], | ||
81 | + relativeTo: distDir.css, | ||
82 | + cachebuster: function(filePath, urlPathname) { | ||
83 | + | ||
84 | + //只给字体加no-cache | ||
85 | + if (/font\//.test(urlPathname)) { | ||
86 | + return fs.statSync(filePath).mtime.getTime().toString(16); | ||
87 | + } | ||
88 | + } | ||
89 | + }; | ||
90 | + | ||
91 | + Object.assign(sprites, { | ||
92 | + basePath: distDir.img, | ||
93 | + stylesheetPath: distDir.css, | ||
94 | + spritePath: distDir.img | ||
95 | + }); | ||
96 | + } | ||
97 | + | ||
98 | + return [ | ||
99 | + require('precss'), | ||
100 | + require('postcss-assets')(assets), | ||
101 | + require('postcss-sprites').default(sprites), | ||
102 | + require('postcss-calc'), | ||
103 | + require('postcss-pxtorem')({ | ||
104 | + rootValue: 40, | ||
105 | + unitPrecision: 5, // 保留5位小数字 | ||
106 | + minPixelValue: 2, // 小于 2px 时,不转换, 单位为 PX 大写的时候不转换 | ||
107 | + selectorBlackList: [], // 选择器黑名单,可以使用正则 | ||
108 | + propWhiteList: [] // 属性名称为空,表示替换所有属性的值 | ||
109 | + }), | ||
110 | + require('autoprefixer')({ | ||
111 | + browsers: ['> 1%'] | ||
112 | + }), | ||
113 | + | ||
114 | + //可选 | ||
115 | + require('postcss-use')({ | ||
116 | + modules: ['postcss-clearfix', 'postcss-crip', 'postcss-short', 'postcss-center', 'postcss-position'] | ||
117 | + }) | ||
118 | + ]; | ||
119 | +} | ||
120 | + | ||
121 | +//Postcss开发环境 | ||
122 | +gulp.task('postcss-dev', function() { | ||
123 | + return gulp.src('sass/index.css') | ||
124 | + .pipe(sourcemaps.init()) | ||
125 | + .pipe(postcss(postcssEnvPlugin('DEV'))) | ||
126 | + .pipe(sourcemaps.write('.')) | ||
127 | + .pipe(gulp.dest('css/')) | ||
128 | +}); | ||
129 | + | ||
130 | +gulp.task('postcss-watch', function() { | ||
131 | + gulp.watch('sass/**/*.css', ['postcss-dev']); | ||
50 | }); | 132 | }); |
51 | 133 | ||
52 | -// compass watch | ||
53 | -gulp.task('compass-watch', function() { | ||
54 | - gulp.watch('sass/**/*.scss', ['compass']); | 134 | +//Postcss正式环境生成 |
135 | +gulp.task('postcss-pro', ['assets'], function() { | ||
136 | + return gulp.src('sass/index.css') | ||
137 | + .pipe(postcss(postcssEnvPlugin('PRO'))) | ||
138 | + .pipe(cssnano()) | ||
139 | + .pipe(gulp.dest(distDir.css)) | ||
55 | }); | 140 | }); |
56 | 141 | ||
57 | // start spm server | 142 | // start spm server |
58 | gulp.task('spm-doc', function() { | 143 | gulp.task('spm-doc', function() { |
59 | - var sd = cp.exec('spm doc'); | 144 | + var sd = cp.exec('spm doc watch --port 8000'); // PC 用8001,H5 用8000, 跑两个服务器,不冲突 |
60 | 145 | ||
61 | // sd.stdout.on('data', function(data) { | 146 | // sd.stdout.on('data', function(data) { |
62 | // console.log(data); | 147 | // console.log(data); |
@@ -72,10 +157,10 @@ gulp.task('spm-doc', function() { | @@ -72,10 +157,10 @@ gulp.task('spm-doc', function() { | ||
72 | }); | 157 | }); |
73 | 158 | ||
74 | //生成发布目录,可用于上传测试机 | 159 | //生成发布目录,可用于上传测试机 |
75 | -gulp.task('ge', ['assets', 'compass-production', 'build']); | 160 | +gulp.task('ge', ['assets', 'postcss-pro', 'build']); |
76 | 161 | ||
77 | //发布 | 162 | //发布 |
78 | -gulp.task('dist', ['assets', 'compass-production', 'build'], function() { | 163 | +gulp.task('dist', ['assets', 'postcss-pro', 'build'], function() { |
79 | var ftpstream = ftp(ftpConfig); | 164 | var ftpstream = ftp(ftpConfig); |
80 | 165 | ||
81 | return gulp.src('dist/**/') | 166 | return gulp.src('dist/**/') |
@@ -84,30 +169,16 @@ gulp.task('dist', ['assets', 'compass-production', 'build'], function() { | @@ -84,30 +169,16 @@ gulp.task('dist', ['assets', 'compass-production', 'build'], function() { | ||
84 | }); | 169 | }); |
85 | 170 | ||
86 | //font+img->dist/assets | 171 | //font+img->dist/assets |
87 | -gulp.task('assets', function() { | ||
88 | - gulp.src('img/**') | 172 | +gulp.task('assets', ['img', 'font']); |
173 | + | ||
174 | +gulp.task('img', function() { | ||
175 | + return gulp.src('img/**/*') | ||
89 | .pipe(gulp.dest(distDir.img)); | 176 | .pipe(gulp.dest(distDir.img)); |
90 | - gulp.src('font/*') | ||
91 | - .pipe(gulp.dest(distDir.font)); | ||
92 | }); | 177 | }); |
93 | 178 | ||
94 | -//compass | ||
95 | -gulp.task('compass-production', ['assets'], function() { | ||
96 | - gulp.src('sass/index.scss') | ||
97 | - .pipe( | ||
98 | - compass({ | ||
99 | - css: distDir.css, | ||
100 | - sass: 'sass', | ||
101 | - image: distDir.img, | ||
102 | - font: distDir.font, | ||
103 | - http_path: '/', | ||
104 | - style: 'compressed' | ||
105 | - }) | ||
106 | - ) | ||
107 | - .on('error', function(error) { | ||
108 | - console.log(error); | ||
109 | - this.emit('end'); | ||
110 | - }); | 179 | +gulp.task('font', function() { |
180 | + return gulp.src('font/*') | ||
181 | + .pipe(gulp.dest(distDir.font)) | ||
111 | }); | 182 | }); |
112 | 183 | ||
113 | //spm build | 184 | //spm build |
@@ -190,4 +261,4 @@ gulp.task('business', ['libs'], function() { | @@ -190,4 +261,4 @@ gulp.task('business', ['libs'], function() { | ||
190 | .pipe(uglify()) | 261 | .pipe(uglify()) |
191 | .pipe(concat('index.js')) | 262 | .pipe(concat('index.js')) |
192 | .pipe(gulp.dest(distDir.js)); | 263 | .pipe(gulp.dest(distDir.js)); |
193 | -}); | ||
264 | +}); |
static/img/coupon/click-txt.png
0 → 100644

1.99 KB
static/img/coupon/coupon1.png
0 → 100644

31.8 KB
static/img/coupon/received.png
0 → 100644

5.91 KB
static/img/coupon/received1.png
0 → 100644

9.88 KB
static/img/coupon/zero.png
0 → 100644

6.38 KB
static/img/coupon/zero1.png
0 → 100644

7.96 KB
@@ -373,12 +373,12 @@ | @@ -373,12 +373,12 @@ | ||
373 | padding: 5px 15px; | 373 | padding: 5px 15px; |
374 | background: #f00; | 374 | background: #f00; |
375 | color: #fff; | 375 | color: #fff; |
376 | - border-radius(10px; | 376 | + border-radius: 10px; |
377 | margin-left: 20px; | 377 | margin-left: 20px; |
378 | } | 378 | } |
379 | 379 | ||
380 | .coupon-use { | 380 | .coupon-use { |
381 | - box-sizing(border-box; | 381 | + box-sizing: border-box; |
382 | position: relative; | 382 | position: relative; |
383 | float: right; | 383 | float: right; |
384 | padding-right: 30px; | 384 | padding-right: 30px; |
@@ -445,7 +445,7 @@ | @@ -445,7 +445,7 @@ | ||
445 | .block { | 445 | .block { |
446 | input, textarea { | 446 | input, textarea { |
447 | box-sizing: border-box; | 447 | box-sizing: border-box; |
448 | - margin: 20px) 0; | 448 | + margin: 20px 0; |
449 | padding: 0 12px; | 449 | padding: 0 12px; |
450 | width: 100%; | 450 | width: 100%; |
451 | height: 72px; | 451 | height: 72px; |
@@ -455,7 +455,7 @@ | @@ -455,7 +455,7 @@ | ||
455 | line-height: 1; | 455 | line-height: 1; |
456 | outline: 0; | 456 | outline: 0; |
457 | border: 0; | 457 | border: 0; |
458 | - border-radius(4px; | 458 | + border-radius: 4px; |
459 | } | 459 | } |
460 | textarea { | 460 | textarea { |
461 | padding: 12px; | 461 | padding: 12px; |
@@ -519,7 +519,7 @@ | @@ -519,7 +519,7 @@ | ||
519 | height: 88px; | 519 | height: 88px; |
520 | line-height: 88px; | 520 | line-height: 88px; |
521 | margin-bottom: 28px; | 521 | margin-bottom: 28px; |
522 | - border-radius(5px; | 522 | + border-radius: 5px; |
523 | font-size: 32px; | 523 | font-size: 32px; |
524 | color: #fff; | 524 | color: #fff; |
525 | text-align: center; | 525 | text-align: center; |
@@ -6,6 +6,7 @@ | @@ -6,6 +6,7 @@ | ||
6 | li { | 6 | li { |
7 | float: left; | 7 | float: left; |
8 | width: 100%; | 8 | width: 100%; |
9 | + | ||
9 | a, img { | 10 | a, img { |
10 | display: block; | 11 | display: block; |
11 | width: 100%; | 12 | width: 100%; |
@@ -19,15 +20,17 @@ | @@ -19,15 +20,17 @@ | ||
19 | right: 0; | 20 | right: 0; |
20 | bottom: 20px; | 21 | bottom: 20px; |
21 | text-align: center; | 22 | text-align: center; |
23 | + | ||
22 | .pagination-inner { | 24 | .pagination-inner { |
23 | display: inline-block; | 25 | display: inline-block; |
26 | + | ||
24 | span { | 27 | span { |
25 | display: inline-block; | 28 | display: inline-block; |
26 | width: 14px; | 29 | width: 14px; |
27 | height: 14px; | 30 | height: 14px; |
28 | background: #fff; | 31 | background: #fff; |
29 | opacity: 0.5; | 32 | opacity: 0.5; |
30 | - margin: 0 (9px); | 33 | + margin: 0 9px; |
31 | border-radius: 50%; | 34 | border-radius: 50%; |
32 | } | 35 | } |
33 | span.swiper-active-switch { | 36 | span.swiper-active-switch { |
@@ -37,6 +40,7 @@ | @@ -37,6 +40,7 @@ | ||
37 | } | 40 | } |
38 | } | 41 | } |
39 | 42 | ||
43 | + | ||
40 | .fresh-list-swiper { | 44 | .fresh-list-swiper { |
41 | overflow: hidden; | 45 | overflow: hidden; |
42 | padding-bottom: 15px; | 46 | padding-bottom: 15px; |
@@ -50,7 +54,7 @@ | @@ -50,7 +54,7 @@ | ||
50 | li { | 54 | li { |
51 | float:left; | 55 | float:left; |
52 | width:240px; | 56 | width:240px; |
53 | - margin: (20px) (10px) 0 (10px); | 57 | + margin: 20px 10px 0 10px; |
54 | border: none; | 58 | border: none; |
55 | 59 | ||
56 | &:first-child { | 60 | &:first-child { |
@@ -96,7 +100,7 @@ | @@ -96,7 +100,7 @@ | ||
96 | } | 100 | } |
97 | 101 | ||
98 | .old-price { | 102 | .old-price { |
99 | - margin: 0 0 0 (10px); | 103 | + margin: 0 0 0 10px; |
100 | color: #b0b0b0; | 104 | color: #b0b0b0; |
101 | text-decoration: line-through; | 105 | text-decoration: line-through; |
102 | font-size: 22px; | 106 | font-size: 22px; |
@@ -105,13 +109,13 @@ | @@ -105,13 +109,13 @@ | ||
105 | .fresh-icon { | 109 | .fresh-icon { |
106 | background: #d62927; | 110 | background: #d62927; |
107 | width: 100px; | 111 | width: 100px; |
108 | - height: 20px; | 112 | + height: 33px; |
109 | display: block; | 113 | display: block; |
110 | - margin: (8px) auto 0 auto; | 114 | + margin: 8px auto 0 auto; |
111 | color: #fff; | 115 | color: #fff; |
112 | text-align: center; | 116 | text-align: center; |
113 | border-radius: 40px; | 117 | border-radius: 40px; |
114 | - line-height: 20px; | 118 | + line-height: 33px; |
115 | } | 119 | } |
116 | } | 120 | } |
117 | } | 121 | } |
@@ -119,5 +123,5 @@ | @@ -119,5 +123,5 @@ | ||
119 | 123 | ||
120 | .fresh-list{ | 124 | .fresh-list{ |
121 | position: relative; | 125 | position: relative; |
122 | - padding:(15px) 0 0 (15px); | 126 | + padding: 15px 0 0 15px; |
123 | } | 127 | } |
@@ -18,6 +18,8 @@ | @@ -18,6 +18,8 @@ | ||
18 | @import "home-header"; | 18 | @import "home-header"; |
19 | @import "thumb-row"; | 19 | @import "thumb-row"; |
20 | @import "notice"; | 20 | @import "notice"; |
21 | +@import "fresh-only"; | ||
22 | +@import "coupon"; | ||
21 | 23 | ||
22 | .mobile-container{ | 24 | .mobile-container{ |
23 | width: 100%; | 25 | width: 100%; |
@@ -34,7 +36,6 @@ | @@ -34,7 +36,6 @@ | ||
34 | transform: translateX(540px); | 36 | transform: translateX(540px); |
35 | } | 37 | } |
36 | 38 | ||
37 | - | ||
38 | .overlay { | 39 | .overlay { |
39 | display: none; | 40 | display: none; |
40 | position: absolute; | 41 | position: absolute; |
-
Please register or login to post a comment