# Dfx generate assumes too much

**URL:** <https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172>\
**Category:** Developers\
**Created:** [May 22, 2023, 9:00pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172 "2023-05-22T21:00:47Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 22, 2023, 9:00pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/1 "2023-05-22T21:00:47Z")

</div>

dfx generate seems to assume everyone is using webpack which is not the case. I am having to do add custom hacks into my workflow to get around the assumption of webpack, as I am using vite.

Look at this code:

```javascript
import { Actor, HttpAgent } from "@dfinity/agent";

// Imports and re-exports candid interface
import { idlFactory } from "./wallet_backend.did.js";
export { idlFactory } from "./wallet_backend.did.js";

/* CANISTER_ID is replaced by webpack based on node environment
 * Note: canister environment variable will be standardized as
 * process.env.CANISTER_ID_<CANISTER_NAME_UPPERCASE>
 * beginning in dfx 0.15.0
 */
export const canisterId =
  process.env.CANISTER_ID_WALLET_BACKEND ||
  process.env.WALLET_BACKEND_CANISTER_ID;

export const createActor = (canisterId, options = {}) => {
  const agent = options.agent || new HttpAgent({ ...options.agentOptions });

  if (options.agent && options.agentOptions) {
    console.warn(
      "Detected both agent and agentOptions passed to createActor. Ignoring agentOptions and proceeding with the provided agent."
    );
  }

  // Fetch root key for certificate validation during development
  if (process.env.DFX_NETWORK !== "ic") {
    agent.fetchRootKey().catch((err) => {
      console.warn(
        "Unable to fetch root key. Check to ensure that your local replica is running"
      );
      console.error(err);
    });
  }

  // Creates an actor with using the candid interface and the HttpAgent
  return Actor.createActor(idlFactory, {
    agent,
    canisterId,
    ...options.actorOptions,
  });
};

export const wallet_backend = createActor(canisterId);

```

Notice this:

```auto
  process.env.CANISTER_ID_WALLET_BACKEND ||
  process.env.WALLET_BACKEND_CANISTER_ID;

```

Regular browser code does not have `process.env` defined, thus I am forced to define it. And the only reason it exists is for `export const wallet_backend = createActor(canisterId);`. This side-effect in the loading of this file has caused problems before in Node.js, thus the node\_compatilibity flag was set. Now I am forced to use this flag even for my front-end code.

I think the side-effect in the loading of the file and a heavy dependence on webpack-specific code should be avoided.

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 22, 2023, 9:18pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/2 "2023-05-22T21:18:22Z")

</div>

Actually I still haven’t gotten this to work yet, here’s a related issue: [Global is not defined](https://forum.dfinity.org/t/global-is-not-defined/20173)

---

<div class="post-metadata">

**Author:** ![diegop](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/diegop/32/569_2.png) [@diegop](https://forum.dfinity.org/u/diegop)\
**Post date:** [May 22, 2023, 9:50pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/3 "2023-05-22T21:50:49Z")

</div>

Fair feedback, let me pass to SDK folks

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 22, 2023, 10:00pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/4 "2023-05-22T22:00:46Z")

</div>

Another potentially related issue: [Dfx generate fetchRootKey broken with vite](https://forum.dfinity.org/t/dfx-generate-fetchrootkey-broken-with-vite/20175)

---

<div class="post-metadata">

**Author:** ![dfx-json](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/dfx-json/32/4784_2.png) [@dfx-json](https://forum.dfinity.org/u/dfx-json)\
**Post date:** [May 22, 2023, 10:49pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/5 "2023-05-22T22:49:19Z")

</div>

we’ve been slowly trying to remove the webpack tentacles from dfx. we discussed some possible options as a team earlier. here is what we’re thinking:

1. we will provide a configuration that dfx generate will use to determine how to define / insert canister IDs at build time. this may be called `env_convention` and the valid values will be `none, process.env, import.meta`
2. depending on the selected configuration, dfx will either use `process.env` (supported by webpack) or `import.meta` (an emerging web standard, supported by vite).
3. dfx will also generate a JS file that exports canister IDs as constants. this can be used when `none` is chosen as the selected option for `env_convention`

we will discuss this as a team and refine further, and possibly make changes to what i’m describing, but this is where we’re at right now as a start

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 23, 2023, 3:55pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/6 "2023-05-23T15:55:11Z")

</div>

You could consider creating the process object if it doesn’t exist, that was the main problem I had. Also the global object could not be found, you could consider creating that if it doesn’t exist.

These have been simple enough for me to polyfill, but it’s sad that it just breaks in esoteric ways that would be hard for a newcomer to understand.

My main problem now is that the agent simply won’t work because of issues with fetching the root key and/or message verification. I’m trying to run my frontend from my own server and from the canister, and it simply won’t work. I am still facing this issue right now, discussion here: [Dfx generate fetchRootKey broken with vite](https://forum.dfinity.org/t/dfx-generate-fetchrootkey-broken-with-vite/20175)

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 23, 2023, 4:05pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/7 "2023-05-23T16:05:39Z")

</div>

There’s a problem in the non-node-compatible generated code, which is that it calls createActor during initialization of the module. This means that the developer cannot insert their own settings into the agent, meaning that if a browser app wants to serve from a different domain then they can’t use the default generated code, they would have to turn on node compatibility, but they aren’t even running their app in node.

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 23, 2023, 4:11pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/8 "2023-05-23T16:11:48Z")

</div>

It seems that no combination of URLs in the browser, in the HttpAgent settings for the client, deploying to a canister or running a standalone server, etc that I’ve tried can give me a consistent working agent.

---

<div class="post-metadata">

**Author:** ![peterparker](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@peterparker](https://forum.dfinity.org/u/peterparker)\
**Post date:** [May 23, 2023, 4:51pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/9 "2023-05-23T16:51:53Z")

</div>

In Juno, which uses Vite, I set the `"node_compatibility": true` in dfx.json and then use a script ([https://github.com/buildwithjuno/juno/blob/main/scripts/update.types.mjs](https://github.com/buildwithjuno/juno/blob/main/scripts/update.types.mjs)) to clean the types that are automatically generated. That way I keep only what’s needed, what compiles and I create my own factories.

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 23, 2023, 10:30pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/10 "2023-05-23T22:30:28Z")

</div>

I found a solution to my problems as described more here: [Dfx generate fetchRootKey broken with vite - #25 by lastmjs](https://forum.dfinity.org/t/dfx-generate-fetchrootkey-broken-with-vite/20175/25)

---

<div class="post-metadata">

**Author:** ![lastmjs](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/lastmjs/32/3406_2.png) [@lastmjs](https://forum.dfinity.org/u/lastmjs)\
**Post date:** [May 23, 2023, 10:31pm UTC](https://forum.dfinity.org/t/dfx-generate-assumes-too-much/20172/11 "2023-05-23T22:31:52Z")

</div>

That being said, I have decided to simply deploy my frontend as a frontend canister. Trying to run a separate frontend server seemed to be causing lots of issues, and I would love to see those addressed, but I’ve moved on from that problem for now.

Ideally a frontend deployed to a canister and running as a static web server would both work equally well with no extra configuration necessary. Especially in a local environment I don’t see why this shouldn’t be possible.
