Deno•17mo ago

Import declarations may only appear at top level of a module

Hello fellow dino's
I'm currently trying to tip my toes into ML and decided to try out tensorflow-js. But it seems I can't get the depdency to import correctly.
at first I just used a script tag that imported the module via cdn, which worked. and then as I wanted to avoid using cdn's I decided to add the dependency to my project and use it that way.
But apparently I'm receiving this error:

Uncaught SyntaxError: import declarations may only appear at top level of a module

Uncaught SyntaxError: import declarations may only appear at top level of a module

At this location:

>>>import * as tf from "/@id/__vite-browser-external:npm:@tensorflow/tfjs@^4.22.0?import";<<<
const run = async () => {
  const model = tf.sequential();
  model.add(tf.layers.dense({ units: 1, inputShape: [1] }));
  model.compile({ loss: "meanSquaredError", optimizer: "sgd" });
  const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
  const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);
  await model.fit(xs, ys, { epochs: 250 });
  document.getElementById("micro-out-div").innerText = model.predict(
    tf.tensor2d([20], [1, 1])
  ).dataSync().toString();
};
run().then();

>>>import * as tf from "/@id/__vite-browser-external:npm:@tensorflow/tfjs@^4.22.0?import";<<<
const run = async () => {
  const model = tf.sequential();
  model.add(tf.layers.dense({ units: 1, inputShape: [1] }));
  model.compile({ loss: "meanSquaredError", optimizer: "sgd" });
  const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
  const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);
  await model.fit(xs, ys, { epochs: 250 });
  document.getElementById("micro-out-div").innerText = model.predict(
    tf.tensor2d([20], [1, 1])
  ).dataSync().toString();
};
run().then();

This code there is the "compiled" version the browser is running. The actual ts doesn't differ too much but for the sake of being able to look at it... Here you go:

import {Rank, Tensor} from "npm:@tensorflow/tfjs-core@4.22.0";
import * as tf from "npm:@tensorflow/tfjs@^4.22.0"; // Tiny TFJS train / predict example.

// Tiny TFJS train / predict example.
const run = async () => {
    // Create a simple model.
    const model = tf.sequential();
    model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

    // Prepare the model for training: Specify the loss and the optimizer.
    model.compile({ loss: "meanSquaredError", optimizer: "sgd" });

    // Generate some synthetic data for training. (y = 2x - 1)
    const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
    const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);

    // Train the model using the data.
    await model.fit(xs, ys, { epochs: 250 });

    // Use the model to do inference on a data point the model hasn't seen.
    // Should print approximately 39.
    document.getElementById("micro-out-div")!.innerText = (model.predict(
        tf.tensor2d([20], [1, 1]),
    ) as Tensor<Rank>).dataSync().toString();
};

run().then();

import {Rank, Tensor} from "npm:@tensorflow/tfjs-core@4.22.0";
import * as tf from "npm:@tensorflow/tfjs@^4.22.0"; // Tiny TFJS train / predict example.

// Tiny TFJS train / predict example.
const run = async () => {
    // Create a simple model.
    const model = tf.sequential();
    model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

    // Prepare the model for training: Specify the loss and the optimizer.
    model.compile({ loss: "meanSquaredError", optimizer: "sgd" });

    // Generate some synthetic data for training. (y = 2x - 1)
    const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
    const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);

    // Train the model using the data.
    await model.fit(xs, ys, { epochs: 250 });

    // Use the model to do inference on a data point the model hasn't seen.
    // Should print approximately 39.
    document.getElementById("micro-out-div")!.innerText = (model.predict(
        tf.tensor2d([20], [1, 1]),
    ) as Tensor<Rank>).dataSync().toString();
};

run().then();

I've tried both "inline install" (so via import foo from "npm:bar";import foo from "npm:bar"; ) and via deno.json install. Both yielded the same result. I just started looking into deno today and maybe I configured something wrong? I decided to try and build a monorepo as I want to do multiple things with this ML project.

Here's my Root deno.jsondeno.json

{
    "tasks": {
    },
    "imports": {
    },
    "compilerOptions": {
        "lib": [
            "ESNext",
            "dom"
        ]
    },
    "nodeModulesDir": "auto",
    "workspace": [
        "modules/*"
    ],
    "fmt": {
        "indentWidth": 4,
        "useTabs": true,
        "semiColons": true,
        "singleQuote": false
    }
}

{
    "tasks": {
    },
    "imports": {
    },
    "compilerOptions": {
        "lib": [
            "ESNext",
            "dom"
        ]
    },
    "nodeModulesDir": "auto",
    "workspace": [
        "modules/*"
    ],
    "fmt": {
        "indentWidth": 4,
        "useTabs": true,
        "semiColons": true,
        "singleQuote": false
    }
}

And of course the one for my module

{
    "tasks": {
        "dev": "vite src"
    },
    "imports": {
        "vite": "npm:vite"
    }
}

{
    "tasks": {
        "dev": "vite src"
    },
    "imports": {
        "vite": "npm:vite"
    }
}

Import declarations may only appear at top level of a module

Uncaught SyntaxError: import declarations may only appear at top level of a module

Uncaught SyntaxError: import declarations may only appear at top level of a module

At this location:

>>>import * as tf from "/@id/__vite-browser-external:npm:@tensorflow/tfjs@^4.22.0?import";<<<
const run = async () => {
  const model = tf.sequential();
  model.add(tf.layers.dense({ units: 1, inputShape: [1] }));
  model.compile({ loss: "meanSquaredError", optimizer: "sgd" });
  const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
  const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);
  await model.fit(xs, ys, { epochs: 250 });
  document.getElementById("micro-out-div").innerText = model.predict(
    tf.tensor2d([20], [1, 1])
  ).dataSync().toString();
};
run().then();

>>>import * as tf from "/@id/__vite-browser-external:npm:@tensorflow/tfjs@^4.22.0?import";<<<
const run = async () => {
  const model = tf.sequential();
  model.add(tf.layers.dense({ units: 1, inputShape: [1] }));
  model.compile({ loss: "meanSquaredError", optimizer: "sgd" });
  const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
  const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);
  await model.fit(xs, ys, { epochs: 250 });
  document.getElementById("micro-out-div").innerText = model.predict(
    tf.tensor2d([20], [1, 1])
  ).dataSync().toString();
};
run().then();

This code there is the "compiled" version the browser is running. The actual ts doesn't differ too much but for the sake of being able to look at it... Here you go:

import {Rank, Tensor} from "npm:@tensorflow/tfjs-core@4.22.0";
import * as tf from "npm:@tensorflow/tfjs@^4.22.0"; // Tiny TFJS train / predict example.

// Tiny TFJS train / predict example.
const run = async () => {
    // Create a simple model.
    const model = tf.sequential();
    model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

    // Prepare the model for training: Specify the loss and the optimizer.
    model.compile({ loss: "meanSquaredError", optimizer: "sgd" });

    // Generate some synthetic data for training. (y = 2x - 1)
    const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
    const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);

    // Train the model using the data.
    await model.fit(xs, ys, { epochs: 250 });

    // Use the model to do inference on a data point the model hasn't seen.
    // Should print approximately 39.
    document.getElementById("micro-out-div")!.innerText = (model.predict(
        tf.tensor2d([20], [1, 1]),
    ) as Tensor<Rank>).dataSync().toString();
};

run().then();

import {Rank, Tensor} from "npm:@tensorflow/tfjs-core@4.22.0";
import * as tf from "npm:@tensorflow/tfjs@^4.22.0"; // Tiny TFJS train / predict example.

// Tiny TFJS train / predict example.
const run = async () => {
    // Create a simple model.
    const model = tf.sequential();
    model.add(tf.layers.dense({ units: 1, inputShape: [1] }));

    // Prepare the model for training: Specify the loss and the optimizer.
    model.compile({ loss: "meanSquaredError", optimizer: "sgd" });

    // Generate some synthetic data for training. (y = 2x - 1)
    const xs = tf.tensor2d([-1, 0, 1, 2, 3, 4], [6, 1]);
    const ys = tf.tensor2d([-3, -1, 1, 3, 5, 7], [6, 1]);

    // Train the model using the data.
    await model.fit(xs, ys, { epochs: 250 });

    // Use the model to do inference on a data point the model hasn't seen.
    // Should print approximately 39.
    document.getElementById("micro-out-div")!.innerText = (model.predict(
        tf.tensor2d([20], [1, 1]),
    ) as Tensor<Rank>).dataSync().toString();
};

run().then();

{
    "tasks": {
    },
    "imports": {
    },
    "compilerOptions": {
        "lib": [
            "ESNext",
            "dom"
        ]
    },
    "nodeModulesDir": "auto",
    "workspace": [
        "modules/*"
    ],
    "fmt": {
        "indentWidth": 4,
        "useTabs": true,
        "semiColons": true,
        "singleQuote": false
    }
}

{
    "tasks": {
    },
    "imports": {
    },
    "compilerOptions": {
        "lib": [
            "ESNext",
            "dom"
        ]
    },
    "nodeModulesDir": "auto",
    "workspace": [
        "modules/*"
    ],
    "fmt": {
        "indentWidth": 4,
        "useTabs": true,
        "semiColons": true,
        "singleQuote": false
    }
}

And of course the one for my module

{
    "tasks": {
        "dev": "vite src"
    },
    "imports": {
        "vite": "npm:vite"
    }
}

{
    "tasks": {
        "dev": "vite src"
    },
    "imports": {
        "vite": "npm:vite"
    }
}

Import declarations may only appear at top level of a module

Import declarations may only appear at top level of a module

No replies yet

Deno

No replies yet

Deno

Similar Threads