Горячая перезагрузка модулей (HMR)

Эксперементируем с HMR

Очень крутой разработчик Rixo, из сообщества Svelte, реализовал предварительную поддержку горячей перезагрузки модулей в Svelte. Это краткое руководство о том, как настроить её в своем проекте Svelte Native.

Начните с создания проекта Svelte Native

Используйте существующий или начните новый проект, как описано в статье Начало работы

Замените svelte-loader на форк от Rixo

Отредактируйте package.json и замените:

    "svelte-loader": "github:halfnelson/svelte-loader#fix-virtual-purge"

на

    "svelte-loader": "github:rixo/svelte-loader#hmr"

Включите параметр HMR в Webpack

Отредактируйте webpack.config.js и замените:

   {
        test: /\.svelte$/,
        exclude: /node_modules/,
        use: [
            {
                loader: 'svelte-loader',
                options: {
                    preprocess: svelteNativePreprocessor()
                }
            }
        ]
    }

на

   {
        test: /\.svelte$/,
        exclude: /node_modules/,
        use: [
            {
                loader: 'svelte-loader',
                options: {
                    preprocess: svelteNativePreprocessor(),
                    hotReload: true,
                    hotOptions: {
                        native: true
                    }
                }
            }
        ]
    }

Проверьте работу

Теперь все должно работать. Запустите своё приложение командой:

tns run android

затем сделайте какую-либо правку в исходных файлах и следите за обновлением отображения. HMR в действии