Sveltekit app build failing due to exit code 1

RYKR · December 8, 2021, 7:11am

Trying to build and deploy a Sveltekit app on Netlify and it has recently started failing and I’m trying to figure out why…here is the error in the build:

11:06:26 PM: file:///opt/build/repo/.svelte-kit/output/server/chunks/MotionSSR-9e98dcbf.js:6
11:06:26 PM: import { number, px, degrees, scale, alpha, progressPercentage, complex, color, filter, percent, vw, vh } from "style-value-types";
11:06:26 PM:                                      ^^^^^
11:06:26 PM: SyntaxError: Named export 'alpha' not found. The requested module 'style-value-types' is a CommonJS module, which may not support all module.exports as named exports.
11:06:26 PM: CommonJS modules can always be imported via the default export, for example using:
11:06:26 PM: import pkg from 'style-value-types';
11:06:26 PM: const { number, px, degrees, scale, alpha, progressPercentage, complex, color, filter, percent, vw, vh } = pkg;
11:06:26 PM:     at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
11:06:26 PM:     at async ModuleJob.run (node:internal/modules/esm/module_job:179:5)
11:06:26 PM:     at async Loader.import (node:internal/modules/esm/loader:178:24)
11:06:26 PM:     at async Object.load_component (file:///opt/build/repo/.svelte-kit/output/server/chunks/app-8df5f4cc.js:553:13)
11:06:26 PM:     at async Promise.all (index 0)
11:06:26 PM:     at async respond$1 (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/ssr.js:1211:11)
11:06:26 PM:     at async render_page (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/ssr.js:1454:19)
11:06:26 PM:     at async resolve (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/ssr.js:1717:10)
11:06:26 PM:     at async respond (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/ssr.js:1696:10)
11:06:26 PM:     at async visit (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/chunks/index4.js:167:20)
11:06:26 PM: SyntaxError: Named export 'alpha' not found. The requested module 'style-value-types' is a CommonJS module, which may not support all module.exports as named exports.
11:06:26 PM: CommonJS modules can always be imported via the default export, for example using:
11:06:26 PM: import pkg from 'style-value-types';
11:06:26 PM: const { number, px, degrees, scale, alpha, progressPercentage, complex, color, filter, percent, vw, vh } = pkg;
11:06:26 PM: > 500 /
11:06:26 PM: Error: 500 /
11:06:26 PM:     at file:///opt/build/repo/node_modules/@sveltejs/kit/dist/chunks/index4.js:86:11
11:06:26 PM:     at visit (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/chunks/index4.js:222:5)
11:06:26 PM:     at async prerender (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/chunks/index4.js:303:6)
11:06:26 PM:     at async Object.prerender (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/chunks/index4.js:368:4)
11:06:26 PM:     at async adapt (file:///opt/build/repo/node_modules/@sveltejs/adapter-netlify/index.js:48:4)
11:06:26 PM:     at async adapt (file:///opt/build/repo/node_modules/@sveltejs/kit/dist/chunks/index4.js:393:2)
11:06:26 PM:     at async file:///opt/build/repo/node_modules/@sveltejs/kit/dist/cli.js:896:5
11:06:26 PM: 
11:06:26 PM: ────────────────────────────────────────────────────────────────
11:06:26 PM:   "build.command" failed                                        
11:06:26 PM: ────────────────────────────────────────────────────────────────
11:06:26 PM: 
11:06:26 PM:   Error message
11:06:26 PM:   Command failed with exit code 1: npm run build
11:06:26 PM: 
11:06:26 PM:   Error location
11:06:26 PM:   In build.command from netlify.toml:
11:06:26 PM:   npm run build
11:06:26 PM: 
11:06:26 PM:   Resolved config
11:06:26 PM:   build:
11:06:26 PM:     command: npm run build
11:06:26 PM:     commandOrigin: config
11:06:26 PM:     environment:
11:06:26 PM:       - NODE_VERSION
11:06:26 PM:     publish: /opt/build/repo/build
11:06:26 PM:     publishOrigin: config
11:06:26 PM:   functions:
11:06:26 PM:     '*':
11:06:26 PM:       node_bundler: esbuild
11:06:26 PM:   functionsDirectory: /opt/build/repo/functions

…I think it has to do with a library that is installed that was working before, but is now not working for whatever reason, but I don’t really understand what I’m reading.

I’m hoping that somebody sees this and knows what might be going on here and can help…

…Thank you

nathanmartin · December 8, 2021, 9:19am

This appears to be related to this:

github.com/sveltejs/kit

issue with using CommonJS modules in "svelte/kit build"

opened 10:05AM - 08 Apr 21 UTC

closed 06:03AM - 22 Apr 21 UTC

xSCIven

vite

**App runs normally while running in dev mode, error is thrown on build** *…*svelte.config.cjs** Note the package causing this issue is set to be converted to esm as of the: ``` optimizeDeps: { include: ['carbon-components-svelte', 'clipboard-copy'] }, ``` **svelte.config.cjs** ``` const sveltePreprocess = require('svelte-preprocess'); const node = require('@sveltejs/adapter-node'); const pkg = require('./package.json'); /** @type {import('@sveltejs/kit').Config} */ module.exports = { // Consult https://github.com/sveltejs/svelte-preprocess // for more information about preprocessors preprocess: sveltePreprocess(), kit: { // By default, `npm run build` will create a standard Node app. // You can create optimized builds for different platforms by // specifying a different adapter adapter: node(), ssr: false, // hydrate the <div id="svelte"> element in src/app.html target: '#svelte', vite: { // optimizeDeps: { // include: ['carbon-components-svelte', 'clipboard-copy'] // }, ssr: { noExternal: Object.keys(pkg.dependencies || {}) }, plugins: [ require('vite-plugin-windicss').default() ] } } }; ``` importing modules from a commonJS package "carbon-components-svelte" like so: **index.svelte** ``` <script> import { FluidForm, TextInput, PasswordInput, Tile } from "carbon-components-svelte"; import ButtonFullBleed from "../components/buttons/buttonFullBleed.svelte" </script> ``` **error** ``` PS C:\Users\henry\sveltekit-dashboard> npm run build > sveltekit-dashboard@0.0.1 build C:\Users\henry\sveltekit-dashboard > svelte-kit build vite v2.1.5 building for production... ✓ 320 modules transformed. .svelte/output/client/_app/manifest.json 0.67kb .svelte/output/client/_app/chunks/index-4d122fc8.js 5.48kb / brotli: 2.12kb .svelte/output/client/_app/assets/pages\index.svelte-802f02f9.css 4.19kb / brotli: 0.85kb .svelte/output/client/_app/start-fbcbe901.js 15.83kb / brotli: 5.41kb .svelte/output/client/_app/pages\index.svelte-97280b82.js 59.90kb / brotli: 15.52kb .svelte/output/client/_app/assets/start-9caedf08.css 459.55kb / brotli: 37.33kb vite v2.1.5 building SSR bundle for production... ✓ 17 modules transformed. .svelte/output/server/app.js 544.67kb Run npm start to try your app locally. > Using @sveltejs/adapter-node > Named export 'FluidForm' not found. The requested module 'carbon-components-svelte' is a CommonJS module, which may not support all module.exports as named exports. CommonJS modules can always be imported via the default export, for example using: import pkg from 'carbon-components-svelte'; const {FluidForm} = pkg; file:///C:/Users/henry/sveltekit-dashboard/.svelte/output/server/app.js:8 import {FluidForm} from "carbon-components-svelte"; SyntaxError: Named export 'FluidForm' not found. The requested module 'carbon-components-svelte' is a CommonJS module, which may not support all module.exports as named exports. CommonJS modules can always be imported via the default export, for example using: import pkg from 'carbon-components-svelte'; const {FluidForm} = pkg; at ModuleJob._instantiate (internal/modules/esm/module_job.js:98:21) at async ModuleJob.run (internal/modules/esm/module_job.js:143:5) at async Loader.import (internal/modules/esm/loader.js:165:24) at async prerender (file:///C:/Users/henry/sveltekit-dashboard/node_modules/@sveltejs/kit/dist/chunks/index6.js:513:14) at async AdapterUtils.prerender (file:///C:/Users/henry/sveltekit-dashboard/node_modules/@sveltejs/kit/dist/chunks/index6.js:745:4) at async adapt (C:\Users\henry\sveltekit-dashboard\node_modules\@sveltejs\adapter-node\index.js:26:4) at async adapt (file:///C:/Users/henry/sveltekit-dashboard/node_modules/@sveltejs/kit/dist/chunks/index6.js:767:2) at async file:///C:/Users/henry/sveltekit-dashboard/node_modules/@sveltejs/kit/dist/cli.js:633:5 ``` -------------------------------------- **Note that**: The same issue happens when a Svelte component that imports a CommonJS module is imported in to a vanilla JS Vite project. You can see the issue for yourselves by importing and instantiating the svelte-nano-donate component at this commit: small-tech/svelte-nano-donate@0d7bcf9 (works, QRious library is inlined) and the one before it (doesn’t work, QRious library is imported from node modules). Note that the second one will also work if you npm install the component via a local file path instead of from npm (I thought everything was fine until I tried to install the component in a Vite/SvelteKit project via npm). (I’m going to go check on the Vite project to see if there are any related issues as we cannot be the first ones to get bitten by this.) Credit: aral ------------------ ***other information*** Node version: v14.15.0 OS: windows 10 10.0, build 19041

Topic		Replies	Views
SvelteKit Deploy error using import { mdsvex } from "mdsvex" Support building , deployment	1	889	August 19, 2021
SvelteKit adapter-utils deploy error Support building , deployment	3	713	September 27, 2021
ESM dependency preventing SvelteKit site from functioning after build completes Support deployment , svelte	6	1694	September 5, 2022
Fails to build due to Firebase Support deployment	11	633	November 20, 2023
Svelte kit app wont run due to ENOENT: no such file or directory Support building , deployment , netlify-newbie , svelte	1	1111	November 19, 2023

Sveltekit app build failing due to exit code 1

Related topics