After adding the --ext '.svelte .svx' to package json:

about.svx

<svelte:head>
	<title>About</title>
</svelte:head>
# markdown heading 1
## markdown heading 2
<h1>About this site</h1>

<p>Hi, I'm Paul, I'm working on teaching myself more front end development with <a href="svelte.dev">Svelte.js</a> and Sapper </p>

output.txt

PS C:\Users\MediaCompy\source\repos\blog> npm run dev

> paulblog@0.0.1 dev C:\Users\MediaCompy\source\repos\blog
> sapper dev --port 3000 --ext '.svelte .svx'

• server
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:27)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                 ^
25:   {/if}
26: </Layout>
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:58)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                                                ^
25:   {/if}
26: </Layout>
src/routes/blog/index.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
Unused CSS selector (13:1)
11:
12: <style>
13:   ul {
      ^
14:     margin: 0 0 1em 0;
15:     line-height: 1.5;

src\node_modules\@sapper\internal\error.svelte changed. rebuilding...
• client
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:27)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                 ^
25:   {/if}
26: </Layout>
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:58)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                                                ^
25:   {/if}
26: </Layout>

src\node_modules\@sapper\app.mjs changed. rebuilding...
[ undefined ]
✔ service worker (19ms)
• server
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:27)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                 ^
25:   {/if}
26: </Layout>
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:58)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                                                ^
25:   {/if}
26: </Layout>
src/routes/blog/index.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
Unused CSS selector (13:1)
11:
12: <style>
13:   ul {
      ^
14:     margin: 0 0 1em 0;
15:     line-height: 1.5;
• client
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:27)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                 ^
25:   {/if}
26: </Layout>
src/node_modules/@sapper/internal/App.svelte
Module Warning (from ./node_modules/svelte-loader/index.js):
'level' is not defined (24:58)
22:     <Error {error} {status}/>
23:   {:else}
24:     <svelte:component this="{level-Infinity.component}" {...level-Infinity.props}/>
                                                                ^
25:   {/if}
26: </Layout>
[ undefined ]
> Listening on http://localhost:3000
✔ service worker (5ms)

package.json

{
  "name": "paulblog",
  "description": "Paul's Blog",
  "version": "0.0.1",
  "scripts": {
    "start": "sapper dev --ext '.svelte .svx'",
    "dev": "sapper dev --port 3000 --ext '.svelte .svx'",
    "build": "sapper export --ext '.svelte .svx'",
    "cy:run": "cypress run",
    "cy:open": "cypress open",
    "test": "run-p --race dev cy:run"
  },
  "dependencies": {
    "compression": "^1.7.1",
    "marked": "^1.1.1",
    "mdsvex": "^0.8.2",
    "polka": "next",
    "sirv": "^0.4.0"
  },
  "devDependencies": {
    "cypress": "^4.10.0",
    "npm-run-all": "^4.1.5",
    "sapper": "^0.27.16",
    "svelte": "^3.24.0",
    "svelte-loader": "^2.9.0",
    "webpack": "^4.7.0"
  }
}

webpack.config.js

const webpack = require('webpack');
const path = require('path');
const config = require('sapper/config/webpack.js');
const pkg = require('./package.json');

const mode = process.env.NODE_ENV;
const dev = mode === 'development';

const alias = { svelte: path.resolve('node_modules', 'svelte') };
const extensions = ['.mjs', '.js', '.json', '.svelte', '.svx', '.html']; //added .svx
const mainFields = ['svelte', 'module', 'browser', 'main'];
const { mdsvex } = require('mdsvex') //imported mdsvex


module.exports = {
  client: {
    entry: config.client.entry(),
    output: config.client.output(),
    resolve: { alias, extensions, mainFields },
    module: {
      rules: [
        {
          test: /\.(svelte|html|svx)$/,
          use: {
            loader: 'svelte-loader',
            options: {
              dev,
              hydratable: true,
              hotReload: false, // pending https://github.com/sveltejs/svelte/issues/2377
              preprocess: mdsvex()
            },
          },
        },
      ],
    },
    mode,
    plugins: [
      // pending https://github.com/sveltejs/svelte/issues/2377
      // dev && new webpack.HotModuleReplacementPlugin(),
      new webpack.DefinePlugin({
        'process.browser': true,
        'process.env.NODE_ENV': JSON.stringify(mode),
      }),
    ].filter(Boolean),
    devtool: dev && 'inline-source-map',
  },

  server: {
    entry: config.server.entry(),
    output: config.server.output(),
    target: 'node',
    resolve: { alias, extensions, mainFields },
    externals: Object.keys(pkg.dependencies).concat('encoding'),
    module: {
      rules: [
        {
          test: /\.(svelte|html|svx)$/,
          use: {
            loader: 'svelte-loader',
            options: {
              css: false,
              generate: 'ssr',
              dev,
              preprocess: mdsvex()
            },
          },
        },
      ],
    },
    mode: process.env.NODE_ENV,
    performance: {
      hints: false, // it doesn't matter if server.js is large
    },
  },

  serviceworker: {
    entry: config.serviceworker.entry(),
    output: config.serviceworker.output(),
    mode: process.env.NODE_ENV,
  },
};