javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-15 19:26:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(webpack): improved svelte HMR (#9497)

Browse Source 
* update svelte config to use svelte-loader

* handle null config

* fix: worker support in .svelte files & update snapshots

* fix after merge

Co-authored-by: halfnelson <dpershouse@gmail.com>
Co-authored-by: Igor Randjelovic <rigor789@gmail.com>
This commit is contained in:
farfromrefuge
2021-08-11 11:42:53 +02:00
committed by GitHub
parent 7960f8361f
commit 59d9271bce
5 changed files with 45 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
packages/webpack5/src/configuration/svelte.ts
View File

@ -1,6 +1,6 @@
import Config from 'webpack-chain';
import { getProjectFilePath, getProjectRootPath } from '../helpers/project';
import { getProjectFilePath } from '../helpers/project';
import { getPlatformName } from '../helpers/platform';
import { env as _env, IWebpackEnv } from '../index';
import { error } from '../helpers/log';
@ -13,47 +13,51 @@ export default function (config: Config, env: IWebpackEnv = _env): Config {
const mode = env.production ? 'production' : 'development';
const production = mode === 'production';
// target('node') is the default but causes svelte-loader to detect it as a "server" render, disabling HMR
// electron-main sneaks us past the target == 'node' check and gets us HMR
config.target('electron-main');
// svelte-hmr still references tns-core-modules, so we shim it here for compat.
config.resolve.alias.set('tns-core-modules', '@nativescript/core');
// resolve .svelte files
// the order is reversed because we are using prepend!
config.resolve.extensions.prepend('.svelte').prepend(`.${platform}.svelte`);
// add worker support to .svelte files (new Worker('./path'))
config.module.rule('workers').test(/\.(js|ts|svelte)$/);
// add a rule for .svelte files
config.module
.rule('svelte')
.test(/\.svelte$/)
.exclude.add(/node_modules/)
.end()
.use('svelte-loader-hot')
.loader('svelte-loader-hot')
.use('svelte-loader')
.loader('svelte-loader')
.tap((options) => {
const svelteConfig = getSvelteConfig();
return {
...options,
dev: !production,
preprocess: getSvelteConfigPreprocessor(),
compilerOptions: {
...svelteConfig?.compilerOptions,
dev: !production,
},
preprocess: svelteConfig?.preprocess,
hotReload: !production,
hotOptions: {
injectCss: false,
native: true,
},
// Suppress A11y warnings
onwarn(warning, warn) {
if (!/A11y:/.test(warning.message)) {
warn(warning);
}
},
};
});
return config;
}
function getSvelteConfigPreprocessor(): any {
const config = getSvelteConfig();
return config?.preprocess;
}
interface ISvelteConfig {
preprocess: any;
compilerOptions: any;
}
function getSvelteConfig(): ISvelteConfig | undefined {