-
Notifications
You must be signed in to change notification settings - Fork 922
/
plugin.js
160 lines (148 loc) · 5.57 KB
/
plugin.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
const svelte = require('svelte/compiler');
const svelteRollupPlugin = require('rollup-plugin-svelte');
const fs = require('fs');
const path = require('path');
const {createMakeHot} = require('svelte-hmr');
let makeHot = (...args) => {
makeHot = createMakeHot({walk: svelte.walk});
return makeHot(...args);
};
module.exports = function plugin(snowpackConfig, pluginOptions = {}) {
const isDev = process.env.NODE_ENV !== 'production';
const useSourceMaps =
snowpackConfig.buildOptions.sourcemap || snowpackConfig.buildOptions.sourceMaps;
// Old Snowpack versions wouldn't build dependencies. Starting in v3.1, Snowpack's build pipeline
// is run on all files, including npm package files. The rollup plugin is no longer needed.
const needsRollupPlugin = typeof snowpackConfig.buildOptions.resolveProxyImports === 'undefined';
// Support importing Svelte files when you install dependencies.
const packageOptions = snowpackConfig.packageOptions || snowpackConfig.installOptions;
if (packageOptions.source === 'local') {
if (needsRollupPlugin) {
packageOptions.rollup = packageOptions.rollup || {};
packageOptions.rollup.plugins = packageOptions.rollup.plugins || [];
packageOptions.rollup.plugins.push(
svelteRollupPlugin({
include: /\.svelte$/,
compilerOptions: {dev: isDev},
// Snowpack wraps JS-imported CSS in a JS wrapper, so use
// Svelte's own first-class `emitCss: false` here.
// TODO: Remove once Snowpack adds first-class CSS import support in deps.
emitCss: false,
}),
);
}
// Support importing sharable Svelte components.
packageOptions.packageLookupFields.push('svelte');
}
if (
pluginOptions.generate !== undefined ||
pluginOptions.dev !== undefined ||
pluginOptions.hydratable !== undefined ||
pluginOptions.css !== undefined ||
pluginOptions.preserveComments !== undefined ||
pluginOptions.preserveWhitespace !== undefined ||
pluginOptions.sveltePath !== undefined
) {
throw new Error(
`[plugin-svelte] Svelte.compile options moved to new config value: {compilerOptions: {...}}`,
);
}
if (pluginOptions.compileOptions !== undefined) {
throw new Error(
`[plugin-svelte] Could not recognize "compileOptions". Did you mean "compilerOptions"?`,
);
}
if (pluginOptions.input && !Array.isArray(pluginOptions.input)) {
throw new Error(`[plugin-svelte] Option "input" must be an array (e.g. ['.svelte', '.svx'])`);
}
if (pluginOptions.input && pluginOptions.input.length === 0) {
throw new Error(`[plugin-svelte] Option "input" must specify at least one filetype`);
}
let configFilePath = path.resolve(
snowpackConfig.root || process.cwd(),
pluginOptions.configFilePath || 'svelte.config.js',
);
let compilerOptions = pluginOptions.compilerOptions;
let preprocessOptions = pluginOptions.preprocess;
let resolveInputOption = pluginOptions.input;
const hmrOptions = pluginOptions.hmrOptions;
if (fs.existsSync(configFilePath)) {
const configFileConfig = require(configFilePath);
preprocessOptions =
preprocessOptions !== undefined ? preprocessOptions : configFileConfig.preprocess;
compilerOptions =
compilerOptions !== undefined ? compilerOptions : configFileConfig.compilerOptions;
resolveInputOption =
resolveInputOption !== undefined ? resolveInputOption : configFileConfig.extensions;
} else {
//user svelte.config.js is optional and should not error if not configured
if (pluginOptions.configFilePath) {
throw new Error(`[plugin-svelte] failed to find Svelte config file: "${configFilePath}"`);
}
}
if (preprocessOptions === undefined) {
preprocessOptions = require('svelte-preprocess')();
}
return {
name: '@snowpack/plugin-svelte',
resolve: {
input: resolveInputOption || ['.svelte'],
output: ['.js', '.css'],
},
knownEntrypoints: [
'svelte/internal',
'svelte-hmr/runtime/hot-api-esm.js',
'svelte-hmr/runtime/proxy-adapter-dom.js',
],
async load({filePath, isHmrEnabled, isSSR, isPackage}) {
let codeToCompile = await fs.promises.readFile(filePath, 'utf-8');
// PRE-PROCESS
if (preprocessOptions !== false) {
codeToCompile = (
await svelte.preprocess(codeToCompile, preprocessOptions, {
filename: filePath,
})
).code;
}
const finalCompileOptions = {
generate: isSSR ? 'ssr' : 'dom',
css: isPackage ? true : false,
...compilerOptions, // Note(drew) should take precedence over generate above
dev: isHmrEnabled || isDev,
outputFilename: filePath,
filename: filePath,
};
const compiled = svelte.compile(codeToCompile, finalCompileOptions);
const {js, css} = compiled;
const output = {
'.js': {
code: js.code,
map: useSourceMaps ? js.map : undefined,
},
};
if (isHmrEnabled && !isSSR) {
output['.js'].code = makeHot({
id: filePath,
compiledCode: js.code,
hotOptions: {
preserveLocalState: true,
injectCss: true,
...hmrOptions,
absoluteImports: false,
noOverlay: true,
},
compiled,
originalCode: codeToCompile,
compileOptions: finalCompileOptions,
});
}
if (!finalCompileOptions.css && css && css.code) {
output['.css'] = {
code: css.code,
map: useSourceMaps ? css.map : undefined,
};
}
return output;
},
};
};