1 | ///@ts-check
|
2 | ;
|
3 | var path = require("path");
|
4 | var gulp = require("gulp");
|
5 | // var sourcemaps = require("gulp-sourcemaps");
|
6 | // const rename = require("gulp-rename");
|
7 |
|
8 | const sass = require("../lib/sass");
|
9 | const cleanCSS = require("../lib/clean-css");
|
10 | var inline = require("../lib/inline");
|
11 | // var empty = require("../lib/empty");
|
12 | var wxssImporter = require("../lib/wxss-importer");
|
13 | var replace = require("../lib/multi-replace");
|
14 | const pkgVar = require('../lib/package-var');
|
15 | var error = require("../log/error");
|
16 | const debug = require("../log/compile");
|
17 | const size = require("../log/size");
|
18 | var TITLE = "wxss";
|
19 | /**
|
20 | * 编译scss
|
21 | * @param {object} config
|
22 | * @param {string|string[]} scssFile 编译源
|
23 | * @returns {NodeJS.ReadWriteStream}
|
24 | */
|
25 | function compileScss(config, scssFile) {
|
26 | // var postCssPlgins = [
|
27 | // // autoprefixer({
|
28 | // // browsers: [
|
29 | // // // ios
|
30 | // // "iOS >= 8",
|
31 | // // // android
|
32 | // // "ChromeAndroid >= 53",
|
33 | // // ],
|
34 | // // }),
|
35 | // ];
|
36 | // if (config.production) {
|
37 | // postCssPlgins.push(cssnano());
|
38 | // }
|
39 | return gulp
|
40 | .src(scssFile, { base: config.src, ignore: config.exclude })
|
41 | // .pipe(config.production ? empty() : sourcemaps.init())
|
42 | .pipe(debug({
|
43 | title: TITLE,
|
44 | dist: config.dist,
|
45 | distExt: ".wxss",
|
46 | }))
|
47 | .pipe(replace(pkgVar(config.var), undefined, "\"{{", "}}\""))
|
48 | .pipe(replace(pkgVar(config.var), undefined, "'{{", "}}'"))
|
49 | .pipe(
|
50 | sass({
|
51 | ///@ts-ignore
|
52 | importer: wxssImporter,
|
53 | // functions: {
|
54 | // 'import-wxss($path)': function (path) { return '@import "' + path + '"' }
|
55 | // },
|
56 | errLogToConsole: true,
|
57 | outputStyle: "expanded",
|
58 | includePaths: [path.join(config.src, config.assets || "./")],
|
59 | }),
|
60 | )
|
61 | .on("error", error("wxss"))
|
62 | .pipe(replace('@charset "UTF-8";', ''))
|
63 | // .pipe(
|
64 | // replace(/@import url\(["']?([\w\/\.\-\_]*)["']?\)/g, ($1, $2) => {
|
65 | // return '@import "' + $2 + '"';
|
66 | // }),
|
67 | // )
|
68 | .pipe(inline(config))
|
69 | .pipe(
|
70 | cleanCSS({
|
71 | sourceMap: false,
|
72 | inline: ['none'],
|
73 | format: config.production ? "minify" : "beautify",
|
74 | level: {
|
75 | 1: {
|
76 | all: true,
|
77 | specialComments: config.production ? 0 : "all",
|
78 | },
|
79 | 2: {
|
80 | restructureRules: true, // controls rule restructuring;
|
81 | },
|
82 | },
|
83 | compatibility: {
|
84 | colors: {
|
85 | opacity: true, // controls `rgba()` / `hsla()` color support
|
86 | },
|
87 | properties: {
|
88 | backgroundClipMerging: true, // controls background-clip merging into shorthand
|
89 | backgroundOriginMerging: true, // controls background-origin merging into shorthand
|
90 | backgroundSizeMerging: true, // controls background-size merging into shorthand
|
91 | colors: true, // controls color optimizations
|
92 | ieBangHack: false, // controls keeping IE bang hack
|
93 | ieFilters: false, // controls keeping IE `filter` / `-ms-filter`
|
94 | iePrefixHack: false, // controls keeping IE prefix hack
|
95 | ieSuffixHack: false, // controls keeping IE suffix hack
|
96 | merging: true, // controls property merging based on understandability
|
97 | shorterLengthUnits: false, // controls shortening pixel units into `pc`, `pt`, or `in` units
|
98 | spaceAfterClosingBrace: false, // controls keeping space after closing brace - `url() no-repeat` into `url()no-repeat`
|
99 | urlQuotes: true, // controls keeping quoting inside `url()`
|
100 | zeroUnits: true, // controls removal of units `0` value
|
101 | },
|
102 | selectors: {
|
103 | adjacentSpace: false, // controls extra space before `nav` element
|
104 | ie7Hack: false, // controls removal of IE7 selector hacks, e.g. `*+html...`
|
105 | // mergeablePseudoClasses: [":active"], // controls a whitelist of mergeable pseudo classes
|
106 | // mergeablePseudoElements: ["::after"], // controls a whitelist of mergeable pseudo elements
|
107 | mergeLimit: 8191, // controls maximum number of selectors in a single rule (since 4.1.0)
|
108 | multiplePseudoMerging: true, // controls merging of rules with multiple pseudo classes / elements (since 4.1.0)
|
109 | },
|
110 | units: {
|
111 | ch: false, // controls treating `ch` as a supported unit
|
112 | in: false, // controls treating `in` as a supported unit
|
113 | pc: false, // controls treating `pc` as a supported unit
|
114 | pt: false, // controls treating `pt` as a supported unit
|
115 | rem: true, // controls treating `rem` as a supported unit
|
116 | vh: true, // controls treating `vh` as a supported unit
|
117 | vm: true, // controls treating `vm` as a supported unit
|
118 | vmax: true, // controls treating `vmax` as a supported unit
|
119 | vmin: true, // controls treating `vmin` as a supported unit
|
120 | rpx: true, // controls treating `vmin` as a supported unit
|
121 | },
|
122 | },
|
123 | }),
|
124 | )
|
125 | .pipe(
|
126 | replace(/@import url\(["']?([\w\/\.\-\_]*)["']?\)/g, ($1, $2) => {
|
127 | return '@import "' + $2 + '"';
|
128 | }),
|
129 | )
|
130 | // .pipe(config.production ? empty() : sourcemaps.write())
|
131 | // .pipe(rename({ extname: ".wxss" }))
|
132 | .pipe(gulp.dest(config.dist))
|
133 | .pipe(size({ title: TITLE, showFiles: true }));
|
134 | }
|
135 |
|
136 | module.exports = compileScss;
|