WIP: Wip vite as suite devserver #17152

vojtatranta · 2025-02-21T09:45:21Z

TODO

✅ static routes
✅ simplify vite config (remove useless nonsense)
✅ remove the changes in the source code / make them compatible with webpack
MOVE the config to suite-build

Description

Related Issue

Resolve

Screenshots:

packages/address-validator/src/index.js

packages/address-validator/src/crypto/cnBase58.js

packages/address-validator/src/crypto/biginteger.js

packages/connect/src/impl/dynamic.ts

vojtatranta · 2025-02-21T09:48:08Z

packages/suite-web/index.html

@@ -0,0 +1,60 @@
+<!doctype html>


this should be unified with the webpack's index.html file, I think thats possible just some variables willneed to be replaced coz it uses webpack's template literals.

Sounds doable to make a script to replace or strip the webpack syntax → make it digestible by Vite.
Question is, when should this script fire?
Quick search: vite might have a hook that allows you to modify the static assets on-the-fly, which would be better than running it manually after each index.html change (although that'd be fine too, this file is not modified very often 🙂 )

Yeah I know it is possible, I have it in one of the commits. Though, I have troubles moving the whole vite config to suite-buiild package for some reason. I tried many things already...

Note to me: don't forget to server the static/index.html file here, not this artificial one.

packages/suite-web/package.json

packages/suite-web/src/index.ts

suite-native/formatters/src/utils.ts

github-actions · 2025-02-21T13:47:49Z

🚀 Expo preview is ready!

Project → trezor-suite-preview
Platforms → android, ios
Scheme → trezorsuitelite
Runtime Version → 26
More info

Learn more about 𝝠 Expo Github Action

vojtatranta · 2025-02-24T13:45:44Z

packages/suite-web/package.json

@@ -7,6 +7,7 @@
        "type-check:watch": "yarn type-check -- --watch",
        "lint:styles": "npx stylelint './src/**/*{.ts,.tsx}' --cache --config ../../.stylelintrc",
        "dev": "yarn rimraf ./build && yarn workspace @trezor/suite-build run dev:web",
+        "dev:vite": "yarn rimraf ./build && vite",


thius should be likely in @trezor/suite-build not here

socket-security · 2025-02-26T10:38:06Z

👍 Dependency issues cleared. Learn more about Socket for GitHub ↗︎

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

Ignoring: npm/vite-plugin-wasm@3.4.1

View full report↗︎

Next steps

Take a deeper look at the dependency

Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at support [AT] socket [DOT] dev.

Remove the package

If you happen to install a dependency that Socket reports as Known Malware you should immediately remove it and select a different dependency. For other alert types, you may may wish to investigate alternative packages or consider if there are other ways to mitigate the specific risk posed by the dependency.

Mark a package as acceptable risk

To ignore an alert, reply with a comment starting with @SocketSecurity ignore followed by a space separated list of ecosystem/package-name@version specifiers. e.g. @SocketSecurity ignore npm/foo@1.0.0 or ignore all packages with @SocketSecurity ignore-all

packages/suite-web/tsconfig.json

marekrjpolak · 2025-02-27T15:56:48Z

Ordinary suite:dev broken for me.

vojtatranta · 2025-02-27T15:58:36Z

Ordinary suite:dev broken for me.

had that too yarn && yarn build:libs fixed it (likely not problem of thsi PR)

vojtatranta · 2025-02-27T16:00:18Z

Ordinary suite:dev broken for me.

had that too yarn && yarn build:libs fixed it (likely not problem of thsi PR)

damn, no longer helps, why the helll. Likely deduping?

Lemonexe · 2025-02-27T16:01:22Z

Tested Webpack: dev Desktop, dev Desktop, linux Desktop build.
They all work correctly ✔️
But Webpack throws a very red warning at all of them, that should be solved ❌
EDIT: same as already reported

vojtatranta · 2025-02-27T16:03:23Z

Tested Webpack: dev Desktop, dev Desktop, linux Desktop build. They all work correctly ✔️ But Webpack throws a very red warning at all of them, that should be solved ❌
Module not found: Error: Can't resolve 'vm' in 'trezor-suite/node_modules/asn1.js/lib/asn1'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

yup, see that too. Server runs, but throws errors. Looking into it.

Probably some yarn deduping caused this...

vojtatranta · 2025-02-27T16:09:19Z

Tested Webpack: dev Desktop, dev Desktop, linux Desktop build. They all work correctly ✔️ But Webpack throws a very red warning at all of them, that should be solved ❌ EDIT: same as already reported

Added what webpack advised us to do. It is no longer with warning. I hope that's correct.

vojtatranta · 2025-02-27T16:53:24Z

packages/suite-web/vite.config.ts

+
+// Use require instead of import for TypeScript files
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const { assetPrefix, project } = require('../suite-build/utils/env');


damn it, I had to do this... Otherviews, the linter was screeming and with @trezor/suite-build would allow the vite config to compile, that's mess, but this wworks

packages/suite-web/vite.config.ts

Lemonexe · 2025-02-28T11:38:28Z

@SocketSecurity ignore npm/vite-plugin-wasm@3.4.1
I have checked the vite-plugin-wasm source and verified legit usage: to generate code that fetches wasm files, using import urls by passed from vite; no external url injected in the lib ✔️

…ontains 'react' structure

…ot constructor

…" without template variables in the paths