Skip to content
This repository was archived by the owner on Jan 18, 2022. It is now read-only.

Commit 3e2223e

Browse files
thghthgh
committed
Pass css as string and mapping to css() callback
1 parent 3563168 commit 3e2223e

File tree

4 files changed

+109
-103
lines changed

4 files changed

+109
-103
lines changed

‎dist/rollup-plugin-vue.common.js

+39-34
Original file line numberDiff line numberDiff line change
@@ -129,45 +129,43 @@ function vueTransform(code, filePath) {
129129
// 4. Process template
130130
var template = processTemplate(nodes.template, filePath, code);
131131

132-
// 5. Process script
133-
var output = {
132+
// 5. Process script & style
133+
return {
134134
js: processScript(nodes.script, filePath, code, template),
135+
css: nodes.style && {
136+
content: parse5.serialize(nodes.style),
137+
lang: checkLang(nodes.style),
138+
},
135139
};
136-
137-
// 6. Process style
138-
if (nodes.style) {
139-
output.css = parse5.serialize(nodes.style);
140-
output.cssLang = checkLang(nodes.style);
141-
}
142-
143-
return output;
144140
}
145141

146142
function vue(options) {
147143
if ( options === void 0 ) options = {};
148144

149145
var filter = rollupPluginutils.createFilter(options.include, options.exclude);
150-
var cssContent = {};
151-
var cssLang = {};
152-
var dest = 'bundle.js';
146+
var styles = {};
147+
var dest = options.css;
153148

154149
return {
155150
name: 'vue',
156151
transform: function transform(source, id) {
157152
if (!filter(id) || !id.endsWith('.vue')) {
153+
if (id.endsWith('vue.common.js')) {
154+
return source.replace(/process\.env\.NODE_ENV/g,
155+
process.env.NODE_ENV || 'window.NODE_ENV');
156+
}
158157
return null;
159158
}
160159

161160
var ref = vueTransform(source, id);
161+
var js = ref.js;
162+
var css = ref.css;
162163

163-
// Map of every stylesheet content
164-
cssContent[id] = ref.css || '';
165-
166-
// Map of every stylesheet lang
167-
cssLang[id] = ref.cssLang || 'css';
164+
// Map of every stylesheet
165+
styles[id] = css || {};
168166

169167
// Component javascript with inlined html template
170-
return ref.js;
168+
return js;
171169
},
172170
ongenerate: function ongenerate(opts) {
173171
if (options.css === false) {
@@ -176,33 +174,36 @@ function vue(options) {
176174

177175
// Combine all stylesheets
178176
var css = '';
179-
Object.keys(cssContent).forEach(function (key) {
180-
css += cssContent[key];
177+
Object.keys(styles).forEach(function (key) {
178+
css += styles[key].content || '';
181179
});
182180

183-
// Emit styles through callback or file
181+
// Emit styles through callback
184182
if (typeof options.css === 'function') {
185-
options.css(css);
186-
183+
options.css(css, styles);
187184
return;
188185
}
189186

190-
// Guess destination filename
191-
if (typeof options.css !== 'string') {
187+
if (typeof dest !== 'string') {
188+
// Don't create unwanted empty stylesheets
189+
if (!css.length) {
190+
return;
191+
}
192+
193+
// Guess destination filename
192194
dest = opts.dest || 'bundle.js';
193195
if (dest.endsWith('.js')) {
194196
dest = dest.slice(0, -3);
195197
}
196-
/* eslint-disable */
197-
options.css = dest + ".css";
198-
/* eslint-enable */
198+
dest = dest + ".css";
199199
}
200200

201-
fs.writeFile(options.css, css, function (err) {
201+
// Emit styles to file
202+
fs.writeFile(dest, css, function (err) {
202203
if (err) {
203204
throw err;
204205
}
205-
emitted(options.css, css.length);
206+
emitted(dest, css.length);
206207
});
207208
},
208209
};
@@ -216,9 +217,13 @@ function green(text) {
216217
return ("\u001b[1m\u001b[32m" + text + "\u001b[39m\u001b[22m");
217218
}
218219

219-
function getSize(size) {
220-
var bytes = size / 1024;
221-
return bytes < 1000 ? ((bytes.toPrecision(3)) + " kB") : (((bytes / 1024).toPrecision(3)) + " MB");
220+
function getSize(bytes) {
221+
if (bytes < 10000) {
222+
return ((bytes.toFixed(0)) + " B");
223+
}
224+
return bytes < 1024000
225+
? (((bytes / 1024).toPrecision(3)) + " kB'")
226+
: (((bytes / 1024 / 1024).toPrecision(4)) + " MB");
222227
}
223228

224229
module.exports = vue;

‎dist/rollup-plugin-vue.js

+39-34
Original file line numberDiff line numberDiff line change
@@ -125,45 +125,43 @@ function vueTransform(code, filePath) {
125125
// 4. Process template
126126
var template = processTemplate(nodes.template, filePath, code);
127127

128-
// 5. Process script
129-
var output = {
128+
// 5. Process script & style
129+
return {
130130
js: processScript(nodes.script, filePath, code, template),
131+
css: nodes.style && {
132+
content: parse5.serialize(nodes.style),
133+
lang: checkLang(nodes.style),
134+
},
131135
};
132-
133-
// 6. Process style
134-
if (nodes.style) {
135-
output.css = parse5.serialize(nodes.style);
136-
output.cssLang = checkLang(nodes.style);
137-
}
138-
139-
return output;
140136
}
141137

142138
function vue(options) {
143139
if ( options === void 0 ) options = {};
144140

145141
var filter = rollupPluginutils.createFilter(options.include, options.exclude);
146-
var cssContent = {};
147-
var cssLang = {};
148-
var dest = 'bundle.js';
142+
var styles = {};
143+
var dest = options.css;
149144

150145
return {
151146
name: 'vue',
152147
transform: function transform(source, id) {
153148
if (!filter(id) || !id.endsWith('.vue')) {
149+
if (id.endsWith('vue.common.js')) {
150+
return source.replace(/process\.env\.NODE_ENV/g,
151+
process.env.NODE_ENV || 'window.NODE_ENV');
152+
}
154153
return null;
155154
}
156155

157156
var ref = vueTransform(source, id);
157+
var js = ref.js;
158+
var css = ref.css;
158159

159-
// Map of every stylesheet content
160-
cssContent[id] = ref.css || '';
161-
162-
// Map of every stylesheet lang
163-
cssLang[id] = ref.cssLang || 'css';
160+
// Map of every stylesheet
161+
styles[id] = css || {};
164162

165163
// Component javascript with inlined html template
166-
return ref.js;
164+
return js;
167165
},
168166
ongenerate: function ongenerate(opts) {
169167
if (options.css === false) {
@@ -172,33 +170,36 @@ function vue(options) {
172170

173171
// Combine all stylesheets
174172
var css = '';
175-
Object.keys(cssContent).forEach(function (key) {
176-
css += cssContent[key];
173+
Object.keys(styles).forEach(function (key) {
174+
css += styles[key].content || '';
177175
});
178176

179-
// Emit styles through callback or file
177+
// Emit styles through callback
180178
if (typeof options.css === 'function') {
181-
options.css(css);
182-
179+
options.css(css, styles);
183180
return;
184181
}
185182

186-
// Guess destination filename
187-
if (typeof options.css !== 'string') {
183+
if (typeof dest !== 'string') {
184+
// Don't create unwanted empty stylesheets
185+
if (!css.length) {
186+
return;
187+
}
188+
189+
// Guess destination filename
188190
dest = opts.dest || 'bundle.js';
189191
if (dest.endsWith('.js')) {
190192
dest = dest.slice(0, -3);
191193
}
192-
/* eslint-disable */
193-
options.css = dest + ".css";
194-
/* eslint-enable */
194+
dest = dest + ".css";
195195
}
196196

197-
fs.writeFile(options.css, css, function (err) {
197+
// Emit styles to file
198+
fs.writeFile(dest, css, function (err) {
198199
if (err) {
199200
throw err;
200201
}
201-
emitted(options.css, css.length);
202+
emitted(dest, css.length);
202203
});
203204
},
204205
};
@@ -212,9 +213,13 @@ function green(text) {
212213
return ("\u001b[1m\u001b[32m" + text + "\u001b[39m\u001b[22m");
213214
}
214215

215-
function getSize(size) {
216-
var bytes = size / 1024;
217-
return bytes < 1000 ? ((bytes.toPrecision(3)) + " kB") : (((bytes / 1024).toPrecision(3)) + " MB");
216+
function getSize(bytes) {
217+
if (bytes < 10000) {
218+
return ((bytes.toFixed(0)) + " B");
219+
}
220+
return bytes < 1024000
221+
? (((bytes / 1024).toPrecision(3)) + " kB'")
222+
: (((bytes / 1024 / 1024).toPrecision(4)) + " MB");
218223
}
219224

220225
export default vue;

‎src/index.js

+25-25
Original file line numberDiff line numberDiff line change
@@ -5,29 +5,27 @@ import vueTransform from './vueTransform';
55

66
export default function vue(options = {}) {
77
const filter = createFilter(options.include, options.exclude);
8-
const cssContent = {};
9-
const cssLang = {};
8+
const styles = {};
9+
let dest = options.css;
1010

1111
return {
1212
name: 'vue',
1313
transform(source, id) {
1414
if (!filter(id) || !id.endsWith('.vue')) {
1515
if (id.endsWith('vue.common.js')) {
16-
return source.replace(/process\.env\.NODE_ENV/g, process.env.NODE_ENV || 'window.NODE_ENV')
16+
return source.replace(/process\.env\.NODE_ENV/g,
17+
process.env.NODE_ENV || 'window.NODE_ENV');
1718
}
1819
return null;
1920
}
2021

21-
const ref = vueTransform(source, id);
22+
const { js, css } = vueTransform(source, id);
2223

23-
// Map of every stylesheet content
24-
cssContent[id] = ref.css || '';
25-
26-
// Map of every stylesheet lang
27-
cssLang[id] = ref.cssLang || 'css';
24+
// Map of every stylesheet
25+
styles[id] = css || {};
2826

2927
// Component javascript with inlined html template
30-
return ref.js;
28+
return js;
3129
},
3230
ongenerate(opts) {
3331
if (options.css === false) {
@@ -36,38 +34,36 @@ export default function vue(options = {}) {
3634

3735
// Combine all stylesheets
3836
let css = '';
39-
Object.keys(cssContent).forEach((key) => {
40-
css += cssContent[key];
37+
Object.keys(styles).forEach((key) => {
38+
css += styles[key].content || '';
4139
});
4240

43-
// Emit styles through callback or file
41+
// Emit styles through callback
4442
if (typeof options.css === 'function') {
45-
options.css(css);
46-
43+
options.css(css, styles);
4744
return;
4845
}
4946

50-
if (typeof options.css !== 'string') {
47+
if (typeof dest !== 'string') {
5148
// Don't create unwanted empty stylesheets
5249
if (!css.length) {
5350
return;
5451
}
5552

5653
// Guess destination filename
57-
let dest = opts.dest || 'bundle.js';
54+
dest = opts.dest || 'bundle.js';
5855
if (dest.endsWith('.js')) {
5956
dest = dest.slice(0, -3);
6057
}
61-
/* eslint-disable */
62-
options.css = `${dest}.css`;
63-
/* eslint-enable */
58+
dest = `${dest}.css`;
6459
}
6560

66-
writeFile(options.css, css, (err) => {
61+
// Emit styles to file
62+
writeFile(dest, css, (err) => {
6763
if (err) {
6864
throw err;
6965
}
70-
emitted(options.css, css.length);
66+
emitted(dest, css.length);
7167
});
7268
},
7369
};
@@ -81,7 +77,11 @@ function green(text) {
8177
return `\u001b[1m\u001b[32m${text}\u001b[39m\u001b[22m`;
8278
}
8379

84-
function getSize(size) {
85-
const bytes = size / 1024;
86-
return bytes < 1000 ? `${bytes.toPrecision(3)} kB` : `${(bytes / 1024).toPrecision(3)} MB`;
80+
function getSize(bytes) {
81+
if (bytes < 10000) {
82+
return `${bytes.toFixed(0)} B`;
83+
}
84+
return bytes < 1024000
85+
? `${(bytes / 1024).toPrecision(3)} kB'`
86+
: `${(bytes / 1024 / 1024).toPrecision(4)} MB`;
8787
}

‎src/vueTransform.js

+6-10
Original file line numberDiff line numberDiff line change
@@ -109,16 +109,12 @@ export default function vueTransform(code, filePath) {
109109
// 4. Process template
110110
const template = processTemplate(nodes.template, filePath, code);
111111

112-
// 5. Process script
113-
const output = {
112+
// 5. Process script & style
113+
return {
114114
js: processScript(nodes.script, filePath, code, template),
115+
css: nodes.style && {
116+
content: parse5.serialize(nodes.style),
117+
lang: checkLang(nodes.style),
118+
},
115119
};
116-
117-
// 6. Process style
118-
if (nodes.style) {
119-
output.css = parse5.serialize(nodes.style);
120-
output.cssLang = checkLang(nodes.style);
121-
}
122-
123-
return output;
124120
}

0 commit comments

Comments
 (0)