I'm having issues with these icons after upgrading my packages.
I've seen both #10 and #18 and experimented by both having svelte-hero-icons in optimizeDeps and ssr:noExternal sections, but whatever I do I cannot get it to work. Sometimes I get import not found: default, then I refresh and I get <Icond is not a valid SSR component.
I'm using version 4.0.3 and I have refactored all my imports to look like this:
```javascript
import preprocess from 'svelte-preprocess';
import node from '@sveltejs/adapter-node';
/** @type {import('@sveltejs/kit').Config} */
const config = {
// Consult https://github.com/sveltejs/svelte-preprocess
// for more information about preprocessors
preprocess: [
preprocess({
postcss: true
})
],
kit: {
adapter: node({
env: {
host: 'HOST',
port: 'PORT'
}
}),
// hydrate the
element in src/app.html
target: '#svelte',
// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
vite: () => ({
optimizeDeps: {
// Tried both with and without
//include: ['svelte-hero-icons']
},
ssr: {
// Tried both with and without
noExternal: ["svelte-hero-icons"],
},
})
}
};
export default config;
```
Hello,
I'm having issues with these icons after upgrading my packages.
I've seen both #10 and #18 and experimented by both having
svelte-hero-iconsinoptimizeDepsandssr:noExternalsections, but whatever I do I cannot get it to work. Sometimes I getimport not found: default, then I refresh and I get<Icond is not a valid SSR component.I'm using version 4.0.3 and I have refactored all my imports to look like this:
And I'm using them like this:
Any ideas what I might be doing wrong?
package.json dependencies
```json "devDependencies": { "@babel/core": "^7.16.12", "@babel/preset-env": "^7.16.11", "@sveltejs/adapter-node": "^1.0.0-next.35", "@sveltejs/kit": "next", "@tailwindcss/aspect-ratio": "^0.4.0", "@tailwindcss/forms": "^0.4.0", "@tailwindcss/line-clamp": "^0.3.1", "@tailwindcss/typography": "^0.5.0", "@testing-library/jest-dom": "^5.16.1", "@testing-library/svelte": "^3.0.3", "@types/jest": "^27.4.0", "@types/testing-library__jest-dom": "^5.14.2", "@typescript-eslint/eslint-plugin": "^5.10.0", "@typescript-eslint/parser": "^5.10.0", "autoprefixer": "^10.4.2", "babel-jest": "^27.4.6", "cssnano": "^5.0.16", "cypress": "^9.3.1", "dotenv-flow": "^3.2.0", "env-cmd": "^10.1.0", "eslint": "^8.7.0", "eslint-config-prettier": "^8.3.0", "eslint-plugin-sonarjs": "^0.11.0", "eslint-plugin-svelte3": "^3.4.0", "jest": "^27.4.7", "jest-junit": "^13.0.0", "jest-sonar-reporter": "^2.0.0", "json": "^11.0.0", "jwt-decode": "^3.1.2", "postcss": "^8.4.5", "postcss-load-config": "^3.1.1", "prettier": "~2.5.1", "prettier-plugin-svelte": "^2.6.0", "sonarqube-scanner": "^2.8.1", "start-server-and-test": "^1.14.0", "svelte": "^3.46.2", "svelte-check": "^2.3.0", "svelte-hero-icons": "^4.0.3", "svelte-jester": "^2.1.5", "svelte-preprocess": "^4.10.2", "tailwindcss": "^3.0.15", "ts-jest": "^27.1.3", "tslib": "^2.3.1", "typescript": "^4.5.5" }, "type": "module", "dependencies": { "@lukeed/uuid": "^2.0.0", "cookie": "^0.4.1", "stripe": "^8.199.0", "svelte-forms-lib": "^2.0.1", "svelte-time": "^0.6.1", "tailwindcss-font-inter": "^3.0.1", "yup": "^0.32.11" } ```
svelte.config.js
```javascript import preprocess from 'svelte-preprocess'; import node from '@sveltejs/adapter-node'; /** @type {import('@sveltejs/kit').Config} */ const config = { // Consult https://github.com/sveltejs/svelte-preprocess // for more information about preprocessors preprocess: [ preprocess({ postcss: true }) ], kit: { adapter: node({ env: { host: 'HOST', port: 'PORT' } }), // hydrate the
Nevermind, there was one file that had been missed in the refactoring and was importing in the old way.