Closed danielbotn closed 3 years ago
Transferring this to the sapper-template repo. Presumably the PR to update to rollup-plugin-svelte@7 that was merged in yesterday didn't update the TypeScript setup script to put the preprocess
option in the right place.
Yeah, if you remove the preprocess: sveltePreprocess()
out of the compilerOptions
and into the top-level of the svelte({})
in rollup.config.js
(for both the server and the client configurations), this works. Should be an easy fix to the setup script.
@Conduitry I did that. Now I am getting a lot of errors. Like the compiler does not understand how to parse Typescript.
C:\software_projects\svelte\myApp>npm run dev
> TODO@0.0.1 dev C:\software_projects\svelte\myApp
> sapper dev
'default' is imported from external module 'svelte-preprocess' but never used
✗ client
src\routes\_layout.svelte
Unexpected token
2: import Nav from '../components/Nav.svelte';
3:
4: export let segment: string;
^
5: </script>
6:
✗ server
src\routes\_layout.svelte
Unexpected token
2: import Nav from '../components/Nav.svelte';
3:
4: export let segment: string;
^
5: </script>
6:
internal/modules/cjs/loader.js:626
throw err;
^
Error: Cannot find module 'C:\software_projects\svelte\daysWebApp\__sapper__\dev\server\server.js'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:623:15)
at Function.Module._load (internal/modules/cjs/loader.js:527:27)
at Function.Module.runMain (internal/modules/cjs/loader.js:837:10)
at internal/main/run_main_module.js:17:11 {
code: 'MODULE_NOT_FOUND',
requireStack: []
}
> Server crashed
✔ service worker (1.7s)
My rollup.config file below:
import path from 'path';
import resolve from '@rollup/plugin-node-resolve';
import replace from '@rollup/plugin-replace';
import commonjs from '@rollup/plugin-commonjs';
import url from '@rollup/plugin-url';
import svelte from 'rollup-plugin-svelte';
import babel from '@rollup/plugin-babel';
import { terser } from 'rollup-plugin-terser';
import typescript from '@rollup/plugin-typescript';
import config from 'sapper/config/rollup.js';
import pkg from './package.json';
const mode = process.env.NODE_ENV;
const dev = mode === 'development';
const legacy = !!process.env.SAPPER_LEGACY_BUILD;
const onwarn = (warning, onwarn) =>
(warning.code === 'MISSING_EXPORT' && /'preload'/.test(warning.message)) ||
(warning.code === 'CIRCULAR_DEPENDENCY' && /[/\\]@sapper[/\\]/.test(warning.message)) ||
(warning.code === 'THIS_IS_UNDEFINED') ||
onwarn(warning);
export default {
client: {
input: config.client.input().replace(/\.js$/, '.ts'),
output: config.client.output(),
plugins: [
replace({
'process.browser': true,
'process.env.NODE_ENV': JSON.stringify(mode)
}),
svelte({
compilerOptions: {
dev,
hydratable: true
}
}),
url({
sourceDir: path.resolve(__dirname, 'src/node_modules/images'),
publicPath: '/client/'
}),
resolve({
browser: true,
dedupe: ['svelte']
}),
commonjs(),
typescript({ sourceMap: dev }),
legacy && babel({
extensions: ['.js', '.mjs', '.html', '.svelte'],
babelHelpers: 'runtime',
exclude: ['node_modules/@babel/**'],
presets: [
['@babel/preset-env', {
targets: '> 0.25%, not dead'
}]
],
plugins: [
'@babel/plugin-syntax-dynamic-import',
['@babel/plugin-transform-runtime', {
useESModules: true
}]
]
}),
!dev && terser({
module: true
})
],
preserveEntrySignatures: false,
onwarn,
},
server: {
input: { server: config.server.input().server.replace(/\.js$/, ".ts") },
output: config.server.output(),
plugins: [
replace({
'process.browser': false,
'process.env.NODE_ENV': JSON.stringify(mode)
}),
svelte({
compilerOptions: {
dev,
generate: 'ssr',
hydratable: true,
},
emitCss: false
}),
url({
sourceDir: path.resolve(__dirname, 'src/node_modules/images'),
publicPath: '/client/',
emitFiles: false // already emitted by client build
}),
resolve({
dedupe: ['svelte']
}),
commonjs(),
typescript({ sourceMap: dev })
],
external: Object.keys(pkg.dependencies).concat(require('module').builtinModules),
preserveEntrySignatures: 'strict',
onwarn,
},
serviceworker: {
input: config.serviceworker.input().replace(/\.js$/, '.ts'),
output: config.serviceworker.output(),
plugins: [
resolve(),
replace({
'process.browser': true,
'process.env.NODE_ENV': JSON.stringify(mode)
}),
commonjs(),
typescript({ sourceMap: dev }),
!dev && terser()
],
preserveEntrySignatures: false,
onwarn,
}
};
Your Rollup config looks malformed. I just fixed this. Try creating a project again and hopefully it should work as expected now
Describe the bug Yesterday I initialized a sapper project with typescript support.
and everything worked fine, but today I can't spin up the dev server Logs
To Reproduce
Expected behavior The development server should start
Stacktraces
Information about your Sapper Installation:
The output of
npx envinfo --system --npmPackages svelte,sapper,rollup,webpack --binaries --browsers
Your browser Chrome
Your hosting environment (i.e. Local, GCP/AWS/Azure, Vercel/Begin, etc...) localhost
If it is an exported (
npm run export
) or dynamic applicationSeverity To be able to develop in Typescript is pretty severe to me
Additional context No.