svelte-preprocess error in svelte.config.js

[rickbsgu]

elderjs newbie here. I installed with the instructions (npx degit Elderjs/template elderjs-app) and on opening Blog.svelte vscode throws a syntax error at the <script> tag:

Error in svelte.config.js ... Cannot find module 'svelte-preprocess'

The svelte.config.js looks like:

const sveltePreprocess = require('svelte-preprocess');

module.exports = {
  preprocess: [
    sveltePreprocess({
      postcss: {
        plugins: [require('autoprefixer')],
      },
    }),
  ],
};

Looking up the 'svelte-preprocess' module, I note that it the import object is preprocess, not sveltePreprocess. I changed the file to look like this (sveltePreprocess -> preprocess)

const preprocess = require('svelte-preprocess');

module.exports = {
  preprocess: [
    preprocess({
      postcss: {
        plugins: [require('autoprefixer')],
      },
    }),
  ],
};

and for some reason, the error went away - although I don't think the change had anything to do with the availability of the 'svelte-preprocess' module (or the variable name, for that matter.)

Is this expected behavior? Is it something that goes away on a build or dev run? If so, it would be good if the docs indicated that, somewhere. If not, perhaps it needs a fix.

[eight04]

Sounds like that VSCode hasn't read all modules yet when you first opened the file. After the change, the loading completed so the error disappeared.

Or, you haven't run npm install (which is the command that installs modules) before opening the file.

[rickbsgu]

Yeah, I definitely ran npm install. It still showed after running npm dev several times.

It's not a biggee, since it eventually went away, but it's disconcerting to see errors right out of the gate.