@tarojs/rn-style-transformer 3.3.13 → 3.3.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/__tests__/config.spec.js +72 -48
- package/__tests__/index.spec.js +16 -13
- package/__tests__/platform.spec.js +38 -15
- package/__tests__/styles/c.rn.scss +5 -0
- package/__tests__/styles/c.scss +5 -0
- package/__tests__/styles/d.rn.scss +3 -0
- package/__tests__/styles/d.scss +3 -0
- package/dist/transforms/postcss.js +20 -0
- package/dist/transforms/postcss.js.map +1 -1
- package/dist/transforms/sass.js +21 -2
- package/dist/transforms/sass.js.map +1 -1
- package/package.json +8 -8
- package/src/transforms/postcss.ts +22 -1
- package/src/transforms/sass.ts +24 -2
package/__tests__/config.spec.js
CHANGED
|
@@ -34,7 +34,20 @@ const defaultConfig = {
|
|
|
34
34
|
}
|
|
35
35
|
}
|
|
36
36
|
|
|
37
|
-
async function run (src,
|
|
37
|
+
async function run (src, filename = './__tests__/styles/a.css', debug) {
|
|
38
|
+
let options
|
|
39
|
+
let config
|
|
40
|
+
|
|
41
|
+
if (typeof src === 'object') {
|
|
42
|
+
({
|
|
43
|
+
src,
|
|
44
|
+
filename = './__tests__/styles/a.css',
|
|
45
|
+
options,
|
|
46
|
+
debug,
|
|
47
|
+
config
|
|
48
|
+
} = src || {})
|
|
49
|
+
}
|
|
50
|
+
|
|
38
51
|
const mergeConfig = recursiveMerge({}, defaultConfig, config)
|
|
39
52
|
// console.log('mergeConfig', JSON.stringify(mergeConfig, null, ' '))
|
|
40
53
|
const styleTransform = new StyleTransform(mergeConfig)
|
|
@@ -50,21 +63,25 @@ async function run (src, config = {}, filename = './__tests__/styles/a.css', opt
|
|
|
50
63
|
|
|
51
64
|
describe('style transform with config options', () => {
|
|
52
65
|
it('config.sass option', async () => {
|
|
53
|
-
const css = await run(
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
66
|
+
const css = await run({
|
|
67
|
+
src: `
|
|
68
|
+
.test {
|
|
69
|
+
color: $base-color;
|
|
70
|
+
height: 10px;
|
|
71
|
+
}
|
|
72
|
+
`,
|
|
73
|
+
config: {
|
|
74
|
+
sass: {
|
|
75
|
+
resource: [
|
|
76
|
+
'__tests__/styles/variable.scss',
|
|
77
|
+
'__tests__/styles/b.css'
|
|
78
|
+
],
|
|
79
|
+
projectDirectory: path.resolve(__dirname, '..'),
|
|
80
|
+
data: '.data { width: 200px }'
|
|
81
|
+
}
|
|
82
|
+
},
|
|
83
|
+
filename: './__tests__/styles/a.scss'
|
|
84
|
+
})
|
|
68
85
|
expect(css).toEqual(getWrapedCSS(`{
|
|
69
86
|
"brn": {
|
|
70
87
|
"color": "red"
|
|
@@ -80,21 +97,25 @@ describe('style transform with config options', () => {
|
|
|
80
97
|
})
|
|
81
98
|
|
|
82
99
|
it('config.sass option without projectDirectory', async () => {
|
|
83
|
-
const css = await run(
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
100
|
+
const css = await run({
|
|
101
|
+
src: `
|
|
102
|
+
.test {
|
|
103
|
+
color: $base-color;
|
|
104
|
+
height: 10px;
|
|
105
|
+
}
|
|
106
|
+
`,
|
|
107
|
+
filename: './__tests__/styles/a.scss',
|
|
108
|
+
config: {
|
|
109
|
+
sass: {
|
|
110
|
+
resource: [
|
|
111
|
+
path.resolve(__dirname, 'styles/variable.scss'),
|
|
112
|
+
path.resolve(__dirname, 'styles/b.css')
|
|
113
|
+
],
|
|
114
|
+
projectDirectory: path.resolve(__dirname, '..'),
|
|
115
|
+
data: '.data { width: 200px }'
|
|
116
|
+
}
|
|
96
117
|
}
|
|
97
|
-
}
|
|
118
|
+
})
|
|
98
119
|
expect(css).toEqual(getWrapedCSS(`{
|
|
99
120
|
"brn": {
|
|
100
121
|
"color": "red"
|
|
@@ -111,10 +132,10 @@ describe('style transform with config options', () => {
|
|
|
111
132
|
|
|
112
133
|
it('config.postcss disable pxTransform', async () => {
|
|
113
134
|
const css = await run(`
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
135
|
+
.test {
|
|
136
|
+
height: 10px;
|
|
137
|
+
}
|
|
138
|
+
`)
|
|
118
139
|
expect(css).toEqual(getWrapedCSS(`{
|
|
119
140
|
"test": {
|
|
120
141
|
"height": scalePx2dp(5)
|
|
@@ -133,11 +154,14 @@ describe('style transform with config options', () => {
|
|
|
133
154
|
}
|
|
134
155
|
}
|
|
135
156
|
}
|
|
136
|
-
const css = await run(
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
157
|
+
const css = await run({
|
|
158
|
+
src: `
|
|
159
|
+
.test {
|
|
160
|
+
height: 10px;
|
|
161
|
+
}
|
|
162
|
+
`,
|
|
163
|
+
config
|
|
164
|
+
})
|
|
141
165
|
expect(css).toEqual(getWrapedCSS(`{
|
|
142
166
|
"test": {
|
|
143
167
|
"height": 5
|
|
@@ -145,9 +169,7 @@ describe('style transform with config options', () => {
|
|
|
145
169
|
}`))
|
|
146
170
|
})
|
|
147
171
|
it('config.alias in css', async () => {
|
|
148
|
-
const css = await run(
|
|
149
|
-
@import '@/b.css';
|
|
150
|
-
`)
|
|
172
|
+
const css = await run("@import '@/b.css';")
|
|
151
173
|
expect(css).toEqual(getWrapedCSS(`{
|
|
152
174
|
"brn": {
|
|
153
175
|
"color": "red"
|
|
@@ -156,9 +178,10 @@ describe('style transform with config options', () => {
|
|
|
156
178
|
})
|
|
157
179
|
|
|
158
180
|
it('config.alias in sass', async () => {
|
|
159
|
-
const css = await run(
|
|
160
|
-
|
|
161
|
-
|
|
181
|
+
const css = await run({
|
|
182
|
+
src: "@import '@/b.scss';",
|
|
183
|
+
filename: './__tests__/styles/a.scss'
|
|
184
|
+
})
|
|
162
185
|
expect(css).toEqual(getWrapedCSS(`{
|
|
163
186
|
"b": {
|
|
164
187
|
"color": "red"
|
|
@@ -167,9 +190,10 @@ describe('style transform with config options', () => {
|
|
|
167
190
|
})
|
|
168
191
|
|
|
169
192
|
it('config.alias in less', async () => {
|
|
170
|
-
const css = await run(
|
|
171
|
-
|
|
172
|
-
|
|
193
|
+
const css = await run({
|
|
194
|
+
src: "@import '@/b.less';",
|
|
195
|
+
filename: './__tests__/styles/a.less'
|
|
196
|
+
})
|
|
173
197
|
expect(css).toEqual(getWrapedCSS(`{
|
|
174
198
|
"b": {
|
|
175
199
|
"color": "red"
|
package/__tests__/index.spec.js
CHANGED
|
@@ -3,7 +3,18 @@ import StyleTransform, { getWrapedCSS } from '../src/transforms'
|
|
|
3
3
|
// 初始化
|
|
4
4
|
const styleTransform = new StyleTransform()
|
|
5
5
|
|
|
6
|
-
async function run (src, filename = './__tests__/styles/a.css',
|
|
6
|
+
async function run (src, filename = './__tests__/styles/a.css', debug) {
|
|
7
|
+
let options
|
|
8
|
+
|
|
9
|
+
if (typeof src === 'object') {
|
|
10
|
+
({
|
|
11
|
+
src,
|
|
12
|
+
filename = './__tests__/styles/a.css',
|
|
13
|
+
options,
|
|
14
|
+
debug
|
|
15
|
+
} = src || {})
|
|
16
|
+
}
|
|
17
|
+
|
|
7
18
|
const css = await styleTransform.transform(src, filename, options)
|
|
8
19
|
if (debug) {
|
|
9
20
|
// eslint-disable-next-line
|
|
@@ -48,9 +59,7 @@ describe('style transform', () => {
|
|
|
48
59
|
})
|
|
49
60
|
|
|
50
61
|
it('.css import source omit extension', async () => {
|
|
51
|
-
const css = await run(
|
|
52
|
-
@import './b';
|
|
53
|
-
`, './__tests__/styles/a.css')
|
|
62
|
+
const css = await run("@import './b';", './__tests__/styles/a.css')
|
|
54
63
|
expect(css).toEqual(getWrapedCSS(`{
|
|
55
64
|
"brn": {
|
|
56
65
|
"color": "red"
|
|
@@ -121,9 +130,7 @@ describe('style transform', () => {
|
|
|
121
130
|
})
|
|
122
131
|
|
|
123
132
|
it('.sass import source omit extension', async () => {
|
|
124
|
-
const css = await run(
|
|
125
|
-
@import './b';
|
|
126
|
-
`, './__tests__/styles/a.scss')
|
|
133
|
+
const css = await run("@import './b';", './__tests__/styles/a.scss')
|
|
127
134
|
expect(css).toEqual(getWrapedCSS(`{
|
|
128
135
|
"b": {
|
|
129
136
|
"color": "red"
|
|
@@ -182,9 +189,7 @@ describe('style transform', () => {
|
|
|
182
189
|
})
|
|
183
190
|
|
|
184
191
|
it('.less tranform node_modules file import', async () => {
|
|
185
|
-
const css = await run(
|
|
186
|
-
@import 'less/test/browser/css/global-vars/simple.css';
|
|
187
|
-
`, './__tests__/styles/a.less')
|
|
192
|
+
const css = await run("@import 'less/test/browser/css/global-vars/simple.css';", './__tests__/styles/a.less')
|
|
188
193
|
expect(css).toEqual(getWrapedCSS(`{
|
|
189
194
|
"test": {
|
|
190
195
|
"color": "red"
|
|
@@ -193,9 +198,7 @@ describe('style transform', () => {
|
|
|
193
198
|
})
|
|
194
199
|
|
|
195
200
|
it('.less import source omit extension', async () => {
|
|
196
|
-
const css = await run(
|
|
197
|
-
@import './b';
|
|
198
|
-
`, './__tests__/styles/a.less')
|
|
201
|
+
const css = await run("@import './b';", './__tests__/styles/a.less')
|
|
199
202
|
expect(css).toEqual(getWrapedCSS(`{
|
|
200
203
|
"b": {
|
|
201
204
|
"color": "red"
|
|
@@ -4,6 +4,15 @@ import StyleTransform, { getWrapedCSS } from '../src/transforms'
|
|
|
4
4
|
const styleTransform = new StyleTransform()
|
|
5
5
|
|
|
6
6
|
async function run (src, filename = './__tests__/styles/a.css', options, debug) {
|
|
7
|
+
if (typeof src === 'object') {
|
|
8
|
+
({
|
|
9
|
+
src,
|
|
10
|
+
filename = './__tests__/styles/a.css',
|
|
11
|
+
options,
|
|
12
|
+
debug
|
|
13
|
+
} = src || {})
|
|
14
|
+
}
|
|
15
|
+
|
|
7
16
|
const css = await styleTransform.transform(src, filename, options)
|
|
8
17
|
if (debug) {
|
|
9
18
|
// eslint-disable-next-line
|
|
@@ -17,16 +26,16 @@ async function run (src, filename = './__tests__/styles/a.css', options, debug)
|
|
|
17
26
|
describe('style transform in cross platform', () => {
|
|
18
27
|
it('postcss cross platform conditional compile', async () => {
|
|
19
28
|
const css = await run(`
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
29
|
+
.test {
|
|
30
|
+
color: red;
|
|
31
|
+
}
|
|
32
|
+
/* #ifdef rn */
|
|
33
|
+
.rn { width: 100px }
|
|
34
|
+
/* #endif */
|
|
35
|
+
/* #ifndef rn */
|
|
36
|
+
.h5 { errSet: 100px }
|
|
37
|
+
/* #endif */
|
|
38
|
+
`)
|
|
30
39
|
expect(css).toEqual(getWrapedCSS(`{
|
|
31
40
|
"test": {
|
|
32
41
|
"color": "red"
|
|
@@ -39,16 +48,30 @@ describe('style transform in cross platform', () => {
|
|
|
39
48
|
|
|
40
49
|
it('not surport style', async () => {
|
|
41
50
|
const css = await run(`
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
51
|
+
.test {
|
|
52
|
+
o: 0.5;
|
|
53
|
+
background: red;
|
|
54
|
+
}
|
|
55
|
+
`)
|
|
47
56
|
expect(css).toEqual(getWrapedCSS(`{
|
|
48
57
|
"test": {
|
|
49
58
|
"o": 0.5,
|
|
50
59
|
"backgroundColor": "red"
|
|
51
60
|
}
|
|
61
|
+
}`))
|
|
62
|
+
})
|
|
63
|
+
|
|
64
|
+
it('nest sass import cross platform', async () => {
|
|
65
|
+
const css = await run({
|
|
66
|
+
src: "@import './c.scss';"
|
|
67
|
+
})
|
|
68
|
+
expect(css).toEqual(getWrapedCSS(`{
|
|
69
|
+
"drn": {
|
|
70
|
+
"color": "red"
|
|
71
|
+
},
|
|
72
|
+
"crn": {
|
|
73
|
+
"color": "red"
|
|
74
|
+
}
|
|
52
75
|
}`))
|
|
53
76
|
})
|
|
54
77
|
})
|
|
@@ -4,6 +4,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.makePostcssPlugins = void 0;
|
|
7
|
+
const path_1 = __importDefault(require("path"));
|
|
8
|
+
const resolve_1 = require("resolve");
|
|
7
9
|
const postcss_1 = __importDefault(require("postcss"));
|
|
8
10
|
const postcss_pxtransform_1 = __importDefault(require("postcss-pxtransform"));
|
|
9
11
|
const postcss_import_1 = __importDefault(require("postcss-import"));
|
|
@@ -18,6 +20,7 @@ const defaultPxtransformOption = {
|
|
|
18
20
|
}
|
|
19
21
|
};
|
|
20
22
|
function makePostcssPlugins({ filename, designWidth, deviceRatio, postcssConfig, transformOptions, additionalData }) {
|
|
23
|
+
const optionsWithDefaults = ['pxtransform', 'postcss-import', 'postcss-reporter', 'stylelint', 'cssModules'];
|
|
21
24
|
if (designWidth) {
|
|
22
25
|
defaultPxtransformOption.config.designWidth = designWidth;
|
|
23
26
|
}
|
|
@@ -37,6 +40,23 @@ function makePostcssPlugins({ filename, designWidth, deviceRatio, postcssConfig,
|
|
|
37
40
|
}
|
|
38
41
|
const skipRows = additionalData ? additionalData.split('\n').length : 0;
|
|
39
42
|
plugins.push(require('stylelint')(rn_stylelint_json_1.default), reporterSkip_1.default({ skipRows, filename }), require('postcss-reporter')({ clearReportedMessages: true }));
|
|
43
|
+
Object.entries(postcssConfig).forEach(([pluginName, pluginOption]) => {
|
|
44
|
+
if (optionsWithDefaults.indexOf(pluginName) > -1)
|
|
45
|
+
return;
|
|
46
|
+
if (!pluginOption || !pluginOption.enable)
|
|
47
|
+
return;
|
|
48
|
+
if (!helper_1.isNpmPkg(pluginName)) { // local plugin
|
|
49
|
+
pluginName = path_1.default.join(process.cwd(), pluginName);
|
|
50
|
+
}
|
|
51
|
+
try {
|
|
52
|
+
const pluginPath = resolve_1.sync(pluginName, { basedir: process.cwd() });
|
|
53
|
+
plugins.push(require(pluginPath)(pluginOption.config || {}));
|
|
54
|
+
}
|
|
55
|
+
catch (e) {
|
|
56
|
+
const msg = e.code === 'MODULE_NOT_FOUND' ? `缺少postcss插件${pluginName}, 已忽略` : e;
|
|
57
|
+
helper_1.printLog(msg, "warning" /* WARNING */);
|
|
58
|
+
}
|
|
59
|
+
});
|
|
40
60
|
return plugins;
|
|
41
61
|
}
|
|
42
62
|
exports.makePostcssPlugins = makePostcssPlugins;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"postcss.js","sourceRoot":"","sources":["../../src/transforms/postcss.ts"],"names":[],"mappings":";;;;;;AAAA,sDAAiD;AACjD,8EAA6C;AAC7C,oEAA0C;AAC1C,
|
|
1
|
+
{"version":3,"file":"postcss.js","sourceRoot":"","sources":["../../src/transforms/postcss.ts"],"names":[],"mappings":"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"}
|
package/dist/transforms/sass.js
CHANGED
|
@@ -5,8 +5,27 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
const fs_1 = __importDefault(require("fs"));
|
|
7
7
|
const path_1 = __importDefault(require("path"));
|
|
8
|
-
const sass_1 = __importDefault(require("sass"));
|
|
9
8
|
const utils_1 = require("../utils");
|
|
9
|
+
/**
|
|
10
|
+
* 用过用户手动安装了 node-sass,启用node-sass,默认使用 sass
|
|
11
|
+
*/
|
|
12
|
+
function getSassImplementation() {
|
|
13
|
+
let sassImplPkg = 'node-sass';
|
|
14
|
+
try {
|
|
15
|
+
require.resolve('node-sass');
|
|
16
|
+
}
|
|
17
|
+
catch (error) {
|
|
18
|
+
try {
|
|
19
|
+
require.resolve('sass');
|
|
20
|
+
sassImplPkg = 'sass';
|
|
21
|
+
}
|
|
22
|
+
catch (ignoreError) {
|
|
23
|
+
sassImplPkg = 'sass';
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
return require(sassImplPkg);
|
|
27
|
+
}
|
|
28
|
+
const sassImplementation = getSassImplementation();
|
|
10
29
|
function makeURL(resource, rootDir) {
|
|
11
30
|
const url = path_1.default.resolve(rootDir, resource);
|
|
12
31
|
if (!fs_1.default.existsSync(url)) {
|
|
@@ -78,7 +97,7 @@ function renderToCSS(src, filename, options, transformOptions) {
|
|
|
78
97
|
};
|
|
79
98
|
const opts = Object.assign(Object.assign(Object.assign({}, options), defaultOpts), { data: src });
|
|
80
99
|
return new Promise((resolve, reject) => {
|
|
81
|
-
|
|
100
|
+
sassImplementation.render(opts, (err, result) => {
|
|
82
101
|
if (err) {
|
|
83
102
|
reject(err);
|
|
84
103
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sass.js","sourceRoot":"","sources":["../../src/transforms/sass.ts"],"names":[],"mappings":";;;;;AAAA,4CAAmB;AACnB,gDAAuB;
|
|
1
|
+
{"version":3,"file":"sass.js","sourceRoot":"","sources":["../../src/transforms/sass.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tarojs/rn-style-transformer",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.17",
|
|
4
4
|
"description": "提供Taro RN 统一处理样式文件能力",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -23,25 +23,25 @@
|
|
|
23
23
|
"npm": ">=6.0.0"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@tarojs/helper": "3.3.
|
|
26
|
+
"@tarojs/helper": "3.3.17",
|
|
27
27
|
"fbjs": "^2.0.0",
|
|
28
28
|
"less": "^3.12.2",
|
|
29
29
|
"postcss": "^7.0.35",
|
|
30
30
|
"postcss-import": "^12.0.1",
|
|
31
|
-
"postcss-pxtransform": "3.3.
|
|
31
|
+
"postcss-pxtransform": "3.3.17",
|
|
32
32
|
"postcss-reporter": "^6.0.1",
|
|
33
33
|
"prop-types": "^15.7.2",
|
|
34
|
-
"sass": "
|
|
34
|
+
"sass": "1.35.2",
|
|
35
35
|
"stylelint": "^13.8.0",
|
|
36
|
-
"stylelint-config-taro-rn": "3.3.
|
|
37
|
-
"stylelint-taro-rn": "3.3.
|
|
36
|
+
"stylelint-config-taro-rn": "3.3.17",
|
|
37
|
+
"stylelint-taro-rn": "3.3.17",
|
|
38
38
|
"stylus": "^0.54.8",
|
|
39
|
-
"taro-css-to-react-native": "3.3.
|
|
39
|
+
"taro-css-to-react-native": "3.3.17"
|
|
40
40
|
},
|
|
41
41
|
"devDependencies": {
|
|
42
42
|
"@types/less": "^3.0.2",
|
|
43
43
|
"@types/postcss-import": "^12.0.0",
|
|
44
44
|
"@types/sass": "^1.16.1"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "3f3ce5f66d370b1982a30e4a5f2c8eb383652063"
|
|
47
47
|
}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
+
import path from 'path'
|
|
2
|
+
import { sync as resolveSync } from 'resolve'
|
|
1
3
|
import postcss, { ProcessOptions } from 'postcss'
|
|
2
4
|
import pxtransform from 'postcss-pxtransform'
|
|
3
5
|
import postcssImport from 'postcss-import'
|
|
4
|
-
import { recursiveMerge } from '@tarojs/helper'
|
|
6
|
+
import { recursiveMerge, isNpmPkg, printLog, processTypeEnum } from '@tarojs/helper'
|
|
5
7
|
import { resolveStyle } from '../utils'
|
|
6
8
|
import reporterSkip from '../utils/reporterSkip'
|
|
7
9
|
import stylelintConfig from '../config/rn-stylelint.json'
|
|
@@ -32,6 +34,8 @@ export function makePostcssPlugins ({
|
|
|
32
34
|
transformOptions,
|
|
33
35
|
additionalData
|
|
34
36
|
}) {
|
|
37
|
+
const optionsWithDefaults = ['pxtransform', 'postcss-import', 'postcss-reporter', 'stylelint', 'cssModules']
|
|
38
|
+
|
|
35
39
|
if (designWidth) {
|
|
36
40
|
defaultPxtransformOption.config.designWidth = designWidth
|
|
37
41
|
}
|
|
@@ -70,6 +74,23 @@ export function makePostcssPlugins ({
|
|
|
70
74
|
require('postcss-reporter')({ clearReportedMessages: true })
|
|
71
75
|
)
|
|
72
76
|
|
|
77
|
+
Object.entries(postcssConfig).forEach(([pluginName, pluginOption]) => {
|
|
78
|
+
if (optionsWithDefaults.indexOf(pluginName) > -1) return
|
|
79
|
+
if (!pluginOption || !(pluginOption as any).enable) return
|
|
80
|
+
|
|
81
|
+
if (!isNpmPkg(pluginName)) { // local plugin
|
|
82
|
+
pluginName = path.join(process.cwd(), pluginName)
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
try {
|
|
86
|
+
const pluginPath = resolveSync(pluginName, { basedir: process.cwd() })
|
|
87
|
+
plugins.push(require(pluginPath)((pluginOption as any).config || {}))
|
|
88
|
+
} catch (e) {
|
|
89
|
+
const msg = e.code === 'MODULE_NOT_FOUND' ? `缺少postcss插件${pluginName}, 已忽略` : e
|
|
90
|
+
printLog(msg, processTypeEnum.WARNING)
|
|
91
|
+
}
|
|
92
|
+
})
|
|
93
|
+
|
|
73
94
|
return plugins
|
|
74
95
|
}
|
|
75
96
|
|
package/src/transforms/sass.ts
CHANGED
|
@@ -1,9 +1,31 @@
|
|
|
1
1
|
import fs from 'fs'
|
|
2
2
|
import path from 'path'
|
|
3
|
-
import
|
|
3
|
+
import { Options } from 'sass'
|
|
4
4
|
import { insertAfter, insertBefore, resolveStyle, getAdditionalData } from '../utils'
|
|
5
5
|
import { TransformOptions, RenderResult, RenderAdditionalResult } from '../types'
|
|
6
6
|
|
|
7
|
+
/**
|
|
8
|
+
* 用过用户手动安装了 node-sass,启用node-sass,默认使用 sass
|
|
9
|
+
*/
|
|
10
|
+
function getSassImplementation () {
|
|
11
|
+
let sassImplPkg = 'node-sass'
|
|
12
|
+
|
|
13
|
+
try {
|
|
14
|
+
require.resolve('node-sass')
|
|
15
|
+
} catch (error) {
|
|
16
|
+
try {
|
|
17
|
+
require.resolve('sass')
|
|
18
|
+
sassImplPkg = 'sass'
|
|
19
|
+
} catch (ignoreError) {
|
|
20
|
+
sassImplPkg = 'sass'
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
return require(sassImplPkg)
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
const sassImplementation = getSassImplementation()
|
|
28
|
+
|
|
7
29
|
// https://github.com/sass/node-sass#options
|
|
8
30
|
export interface Config {
|
|
9
31
|
sass?: SassGlobalConfig
|
|
@@ -99,7 +121,7 @@ function renderToCSS (src, filename, options, transformOptions) {
|
|
|
99
121
|
const opts = { ...options, ...defaultOpts, data: src }
|
|
100
122
|
|
|
101
123
|
return new Promise((resolve, reject) => {
|
|
102
|
-
|
|
124
|
+
sassImplementation.render(opts, (err, result) => {
|
|
103
125
|
if (err) {
|
|
104
126
|
reject(err)
|
|
105
127
|
} else {
|