実現したいこと

syscall/jsをインポートしたい。
go+WebAssemblyでgoよりJavascriptを呼び出したい。

前提

VisualStudioCode Version: 1.77.3
go version go1.19.1 windows/amd64

モジュールの構成は以下です
C
└── study
└──src
|
├── index.html
├── main.go
├──wasm_exec.js
└── .vscode
└── settings.json

発生している問題・エラーメッセージ

Goの勉強を始めました。ネットで紹介していたサンプルを試したのですが、以下のエラーが出ます。
初心者ゆえ見当がつかないです。どうかご教授お願いします。

set GOOS=js
set GOARCH=wasm
go build -o main.wasm main.go

package command-line-arguments
imports syscall/js: build constraints exclude all Go files in C:\Program Files\Go\src\syscall\js

該当のソースコード

main.go
1package main
2
3import (
4	"strconv"
5	syscall/js""
6)
7
8func increment(this js.Value, args []js.Value) any {
9	counter := js.Global().Get("document").Call("getElementById", "counter")
10	counterValue, err := strconv.ParseInt(counter.Get("textContent").String(), 10, 64)
11	if err != nil {
12		return map[string]any{"error": err.Error()}
13	}
14	counterValue += int64(args[0].Int())
15	counter.Set("textContent", counterValue)
16	return map[string]any{"message": counterValue}
17}
18
19func main() {
20	js.Global().Set("goIncrement", js.FuncOf(increment))
21	select {} // keep running
22}

index.html
1<html>
2
3<head>
4    <script src="wasm_exec.js"></script>
5    <script>
6        const go = new Go();
7        WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
8            go.run(result.instance);
9        });
10        function increment(value) {
11            ret = goIncrement(value)
12            console.log(ret)
13        }
14    </script>
15</head>
16
17<body>
18    <div id="counter">0</div>
19    <button onClick="increment(1)">+1</button>
20</body>
21</html>

試したこと

go env GOOS GOARCH
windows
amd64
だったので、以下のように設定を変更したが、同じ結果。
ワークスペースのsettins.jsonを以下のように変更

settins.json
1{
2  "gopls": {
3    "build.env": {
4      "GOOS": "js",
5      "GOARCH": "wasm"
6    }
7  }
8}

補足情報（FW/ツールのバージョンなど）

VisualStudioCode Version: 1.77.3
go version go1.19.1 windows/amd64

エディタ：Visual Studio Code v.1.77.3
OS：Windows10 Pro
Goのバージョン：1.19.1 windows/amd64
環境変数GOPATHの値：%USERPROFILE%\go
環境変数GOROOTの値：C:\Program Files\Go

行動規範の内容に同意します

回答1件

ベストアンサー

GOROOTの値がおかしい？-> 修正後は正しい値だと思います。

手元でGOOS、GOARCHの値を正しくセットしてコンパイルするとエラーは出ませんでした。
あえてGOOS、GOARCHの設定を間違えてコンパイルすると、質問のそのエラーメッセージが出力されました。

GOOS、GOARCHの設定を確認しましょう。
以下のように出力されれば正しく設定できています。

> go env GOOS GOARCH
js
wasm

（追記）設定方法

go env -w GOOS=js GOARCH=wasm

これをやっておくとPC全体にこの値が効くようになります！

投稿2023/04/17 04:46

編集2023/04/18 06:19

nobonobo

総合スコア3367

womomo

2023/04/17 06:26

特に触っていないのですが。 import "fmt"だけだとエラーはでないです。それでも、おかしいですか？

nobonobo

2023/04/17 07:16

質問に書かれたGOROOTの値がおかしいのは確かなので確認ください。「go env GOROOT」の結果を貼りなおしてください。

womomo

2023/04/17 07:44

ご指摘の意味を理解しました。質問のGOROOTを編集しました。

nobonobo

2023/04/17 08:56

「go env GOOS GOARCH」による結果も確認ください。正しくは ``` js wasm ``` という出力になるはずです。

womomo

2023/04/18 06:10 編集

ご回答、ありがとうございます。結果は以下でした。 windows amd64 settings.jsonで設定するとよいとあったので、試したのですが、ダメでした。

nobonobo

2023/04/18 06:17

おお、そうだったんですね。やり方追記します！

womomo

2023/04/18 08:07

沼から抜け出しました！ありがとうございます。

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.29%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

go+WebAssemblyでgoよりsyscall/jsをインポートして、Javascriptを呼び出したい。

実現したいこと

前提

発生している問題・エラーメッセージ

該当のソースコード

試したこと

補足情報（FW/ツールのバージョンなど）

（追記）設定方法

関連した質問