{"id":45419,"date":"2022-11-04T07:48:25","date_gmt":"2022-12-28T12:37:09","guid":{"rendered":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/"},"modified":"2024-04-28T22:56:00","modified_gmt":"2024-04-28T14:56:00","slug":"45419-2","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/","title":{"rendered":""},"content":{"rendered":"

\u5b8c\u6210\u54c1<\/h1>\n
\"\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8<\/div>\n

\u3081\u3061\u3083\u304f\u3061\u3083\u7c21\u7d20\u3067\u3059\u304c\u3001\u4eca\u56de\u306fNuxt3\u3067Wasm\u3092\u52d5\u304b\u3059\u3068\u3044\u3046\u6700\u4f4e\u9650\u306e\u76ee\u6a19\u306e\u305f\u3081\u3054\u5bb9\u8d66\u304f\u3060\u3055\u3044\u3002
\n\u307e\u305f\u7b46\u8005\u304c\u666e\u6bb5\u4f7f\u3063\u3066\u3044\u308bUI\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306fReact\u7cfb\u7d71\u3067Next.js\u3084Fresh(deno\uff09\u3067\u3059\u3002\u4eca\u56deVue\u7cfb\u306e\u30d5\u30ec\u30fc\u30e0\u30ef\u30fc\u30af\u306b\u521d\u3081\u3066\u89e6\u3063\u3066\u3044\u308b\u306e\u3067\u5909\u306a\u3068\u3053\u308d\u304c\u3042\u3063\u305f\u3089\u6307\u6458\u3057\u3066\u304f\u3060\u3055\u308b\u3068\u52a9\u304b\u308a\u307e\u3059\u3002<\/p>\n

\u4f7f\u7528IDE: VSCode
\nOS\uff1a MacOS 13.3.1
\n(\u4f59\u8ac7\u3067\u3059\u304c\u7b46\u8005\u306f\u666e\u6bb5JetBrain\u7cfb\u306eIDE\u3092\u4f7f\u7528\u3057\u3066\u3044\u307e\u3059\u3002\u3057\u304b\u3057Nuxt3\u306e\u5404\u7a2e\u6a5f\u80fd\u304cIDE\u5074\u3067\u4e0a\u624b\u304f\u88dc\u5b8c\u3055\u308c\u306a\u3044\u305f\u3081\u3001VSCode\u3092\u4eca\u56de\u306f\u4f7f\u7528\u3057\u3066\u3044\u307e\u3059\u3002Nuxt3\u3092JetBrains\u7cfbIDE\u3067\u4e0a\u624b\u304f\u4f7f\u3046\u65b9\u6cd5\u3092\u3054\u5b58\u77e5\u306e\u65b9\u304c\u3044\u3089\u3063\u3057\u3083\u3044\u307e\u3057\u305f\u3089\u6559\u3048\u3066\u304f\u3060\u3055\u308b\u3068\u5e78\u3044\u3067\u3059\u3002\uff09<\/p>\n

Nuxt3\u5074\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/h1>\n

\u4ee5\u4e0b\u30b3\u30de\u30f3\u30c9\u3067nuxt3\u306e\u521d\u671f\u5316\u3092\u3057\u307e\u3059\u3002<\/p>\n

npx nuxi@latest init nuxt3-wasm\r\n<\/code><\/pre>\n
\u7d42\u308f\u3063\u305f\u3089\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u79fb\u52d5\u3057\u3066node_modules\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3092\u3057\u307e\u3059\u3002<\/p>\n
cd nuxt3-wasm\r\nyarn install\r\n<\/code><\/pre>\n
\u3053\u3053\u3067\u4e00\u5ea6\u52d5\u4f5c\u78ba\u8a8d\u3057\u3066\u304a\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n
yarn dev\r\n<\/code><\/pre>\n
\u6b21\u306bwasm-pack\u7528vite\u30d7\u30e9\u30b0\u30a4\u30f3\u3001vite-plugin-wasm-pack\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3059\u3002<\/p>\n
yarn add vite vite-plugin-wasm-pack -D\r\n<\/code><\/pre>\n
nuxt.config.ts \u306b\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u8ffd\u52a0\u3057\u307e\u3059\u3002<\/p>\n
import<\/span> wasmpack<\/span> from<\/span> \"<\/span>vite-plugin-wasm-pack<\/span>\"<\/span>;<\/span>\r\nexport<\/span> default<\/span> defineNuxtConfig<\/span>({<\/span>\r\n    vite<\/span>:<\/span> {<\/span>\r\n        plugins<\/span>:<\/span> [<\/span>wasmpack<\/span>(<\/span>\"<\/span>rs_lib<\/span>\"<\/span>)]<\/span>\r\n    }<\/span>\r\n})<\/span>\r\n<\/code><\/pre>\n
package.json\u5185\u306bwasm\u30d3\u30eb\u30c9\u7528\u306e\u30b3\u30de\u30f3\u30c9\u3092\u8ffd\u52a0\u3057\u3066\u304a\u304f\u3068\u4fbf\u5229\u3067\u3059\u3002<\/p>\n
{<\/span>\r\n  \"name\"<\/span>:<\/span> \"nuxt-app\"<\/span>,<\/span>\r\n  \"private\"<\/span>:<\/span> true<\/span>,<\/span>\r\n  \"scripts\"<\/span>:<\/span> {<\/span>\r\n    \"build\"<\/span>:<\/span> \"nuxt build\"<\/span>,<\/span>\r\n    \"dev\"<\/span>:<\/span> \"nuxt dev\"<\/span>,<\/span>\r\n    \"generate\"<\/span>:<\/span> \"nuxt generate\"<\/span>,<\/span>\r\n    \"preview\"<\/span>:<\/span> \"nuxt preview\"<\/span>,<\/span>\r\n    \"postinstall\"<\/span>:<\/span> \"nuxt prepare\"<\/span>,<\/span>\r\n+<\/span>   \"wasm\"<\/span>:<\/span> \"wasm-pack build rs_lib --target web\"<\/span>\r\n<\/span>  },<\/span>\r\n  \"devDependencies\"<\/span>:<\/span> {<\/span>\r\n    \"@types\/node\"<\/span>:<\/span> \"^18\"<\/span>,<\/span>\r\n    \"nuxt\"<\/span>:<\/span> \"^3.4.3\"<\/span>,<\/span>\r\n    \"vite\"<\/span>:<\/span> \"^4.3.6\"<\/span>,<\/span>\r\n    \"vite-plugin-wasm-pack\"<\/span>:<\/span> \"^0.1.12\"<\/span>\r\n  }<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
Rust\u5074\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb<\/h1>\n
Rust\u672c\u4f53\u306e\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u306f\u7d42\u308f\u3063\u3066\u3044\u308b\u3082\u306e\u3068\u4eee\u5b9a\u3057\u307e\u3059\u3002
\nwasm-pack\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u307e\u3059.
\nwasm-pack\u3067Rust\u306e\u30b3\u30fc\u30c9\u3092WebAssembly\u306b\u30b3\u30f3\u30d1\u30a4\u30eb\u3057\u307e\u3059\u3002<\/p>\n
cargo install wasm-pack\r\n<\/code><\/pre>\n
cargo\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n
cargo new --lib rs_lib\r\n<\/code><\/pre>\n
Cargo.toml\u5185\u306b\u4ee5\u4e0b\u306e\u5185\u5bb9\u3092\u8a18\u8ff0\u3057\u307e\u3059\u3002<\/p>\n
[package]<\/span>\r\nname<\/span> =<\/span> \"rs_lib\"<\/span>\r\nversion<\/span> =<\/span> \"0.1.0\"<\/span>\r\nedition<\/span> =<\/span> \"2021\"<\/span>\r\n\r\n# See more keys and their definitions at https:\/\/doc.rust-lang.org\/cargo\/reference\/manifest.html<\/span>\r\n[lib]<\/span>\r\ncrate-type<\/span> =<\/span> [<\/span>\"cdylib\"<\/span>,<\/span> \"rlib\"<\/span>]<\/span>\r\n\r\n[dependencies]<\/span>\r\nwasm-bindgen<\/span> =<\/span> \"0.2.74\"<\/span>\r\n<\/code><\/pre>\n
\u65e9\u901fRust\u3067\u306e\u51e6\u7406\u3092\u8a18\u8ff0\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n
use<\/span> wasm_bindgen<\/span>::<\/span>prelude<\/span>::<\/span>*<\/span>;<\/span>\r\n\r\n#[wasm_bindgen]<\/span>\r\npub<\/span> fn<\/span> add<\/span>(<\/span>a<\/span>:<\/span> isize<\/span>,<\/span> b<\/span>:<\/span> isize<\/span>)<\/span> -><\/span> isize<\/span> {<\/span>\r\n    a<\/span> +<\/span> b<\/span>\r\n}<\/span>\r\n\r\n#[wasm_bindgen]<\/span>\r\npub<\/span> fn<\/span> sub<\/span>(<\/span>a<\/span>:<\/span> isize<\/span>,<\/span> b<\/span>:<\/span> isize<\/span>)<\/span> -><\/span> isize<\/span> {<\/span>\r\n    a<\/span> -<\/span> b<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
\u3053\u3053\u3067\u306f\u975e\u5e38\u306b\u30b7\u30f3\u30d7\u30eb\u306aadd\u95a2\u6570\u3068sub\u95a2\u6570\u3092\u5b9a\u7fa9\u3057\u3066\u3044\u307e\u3059\u3002
\n\u7b26\u53f7\u4ed8\u6574\u6570\u578bisize\u306f\u4f7f\u7528\u3057\u3066\u3044\u308b\u30de\u30b7\u30f3\u306e\u30d3\u30c3\u30c8\u306b\u3042\u3063\u305f\u30b5\u30a4\u30ba\u3092\u3068\u308b\u6574\u6570\u578b\u3067\u3059\u300264bit\u306e\u30b3\u30f3\u30d4\u30e5\u30fc\u30bf\u306a\u3089i64\u578b\u306b\u306a\u308a\u307e\u3059\u3002\u30a2\u30c8\u30ea\u30d3\u30e5\u30fc\u30c8#[wasm_bindgen]\u306e\u8aac\u660e\u306fmdn web doc\u304c\u308f\u304b\u308a\u3084\u3059\u3044\u306e\u3067\u305d\u306e\u307e\u307e\u5f15\u7528\u3057\u307e\u3059\u3002<\/p>\n
\n
wasm-pack \u306f \u5225\u306e\u30c4\u30fc\u30eb\u306e wasm-bindgen \u3092\u5229\u7528\u3057\u3066\u3001JavaScript \u3068 Rust \u306e\u578b\u3092\u7e4b\u3044\u3067\u3044\u307e\u3059\u3002wasm-bindgen \u306b\u3088\u3063\u3066 JavaScript \u304c\u6587\u5b57\u5217\u306b\u95a2\u3059\u308b Rust API \u3092\u547c\u3073\u51fa\u3059\u3053\u3068\u3084 Rust \u306e\u95a2\u6570\u304c JavaScript \u306e\u4f8b\u5916\u3092\u30ad\u30e3\u30c3\u30c1\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002
\n\u5f15\u7528\u5143: https:\/\/developer.mozilla.org\/ja\/docs\/WebAssembly\/Rust_to_wasm<\/p>\n<\/div>\n
\u5358\u4f53\u30c6\u30b9\u30c8\u3082\u66f8\u3044\u3066\u304a\u304d\u307e\u3057\u3087\u3046\u3002<\/p>\n
\r\n#[cfg(test)]<\/span>\r\nmod<\/span> tests<\/span> {<\/span>\r\n    use<\/span> super<\/span>::<\/span>*<\/span>;<\/span>\r\n\r\n    #[test]<\/span>\r\n    fn<\/span> test_add<\/span>()<\/span> {<\/span>\r\n        let<\/span> result<\/span> =<\/span> add<\/span>(<\/span>2<\/span>,<\/span> 2<\/span>);<\/span>\r\n        assert_eq!<\/span>(<\/span>result<\/span>,<\/span> 4<\/span>);<\/span>\r\n    }<\/span>\r\n    #[test]<\/span>\r\n    fn<\/span> test_sub<\/span>()<\/span> {<\/span>\r\n        let<\/span> result<\/span> =<\/span> sub<\/span>(<\/span>2<\/span>,<\/span> 2<\/span>);<\/span>\r\n        assert_eq!<\/span>(<\/span>result<\/span>,<\/span> 0<\/span>);<\/span>\r\n    }<\/span>\r\n}<\/span>\r\n<\/code><\/pre>\n
test\u3092\u5b9f\u884c\u3059\u308b\u305f\u3081\u306b\u306f\u3000rs_lib\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u79fb\u52d5\u3057\u3066,cargo test\u30b3\u30de\u30f3\u30c9\u3092\u5b9f\u884c\u3057\u307e\u3059\u3002<\/p>\n
(<\/span>base)<\/span> stead08@MacBook-Air nuxt3-blog % cd <\/span>rs_lib    \r\n(<\/span>base)<\/span> stead08@MacBook-Air rs_lib % cargo test\r\n    <\/span>Finished test<\/span> [<\/span>unoptimized + debuginfo] target(<\/span>s)<\/span> in <\/span>0.07s\r\n     Running unittests src\/lib.rs (<\/span>target\/debug\/deps\/rs_lib-a79a83277aba64c8)<\/span>\r\n\r\nrunning 2 tests\r\ntest <\/span>tests::test_add ... ok\r\ntest <\/span>tests::test_sub ... ok\r\n\r\ntest <\/span>result: ok. 2 passed;<\/span> 0 failed;<\/span> 0 ignored;<\/span> 0 measured;<\/span> 0 filtered out;<\/span> finished in <\/span>0.00s\r\n\r\n   Doc-tests rs_lib\r\n\r\nrunning 0 tests\r\n\r\ntest <\/span>result: ok. 0 passed;<\/span> 0 failed;<\/span> 0 ignored;<\/span> 0 measured;<\/span> 0 filtered out;<\/span> finished in <\/span>0.00s\r\n<\/code><\/pre>\n
\u554f\u984c\u306a\u304f\u901a\u3063\u3066\u307e\u3059\u306d\u3002
\n\u6b21\u306brust\u306e\u30b3\u30fc\u30c9\u3092wasm\u7528\u306b\u30b3\u30f3\u30d1\u30a4\u30eb\u3057\u307e\u3059\u3002
\n\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u306e\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u623b\u3063\u3066,\u5148\u307b\u3069\u8a2d\u5b9a\u3057\u305fyarn wasm\u30b3\u30de\u30f3\u30c9\u3092\u5b9f\u884c\u3057\u307e\u3059\u3002<\/p>\n
yarn wasm\r\n<\/code><\/pre>\n
\u3053\u308c\u3067wasm-pack\u306b\u3088\u3063\u3066rust\u30b3\u30fc\u30c9\u304cwasm\u5411\u3051\u306b\u30b3\u30f3\u30d1\u30a4\u30eb\u3055\u308c\u307e\u3059\u3002\u305d\u3057\u3066rs_lib\u5185\u306bpkg\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u304c\u4f5c\u6210\u3055\u308c\u305d\u3053\u306bnpm\u30d1\u30c3\u30b1\u30fc\u30b8\u304c\u30d3\u30eb\u30c9\u3055\u308c\u307e\u3059\u3002<\/p>\n
pkg\r\n\u251c\u2500\u2500 package.json\r\n\u251c\u2500\u2500 rs_lib.d.ts\r\n\u251c\u2500\u2500 rs_lib.js\r\n\u251c\u2500\u2500 rs_lib_bg.wasm\r\n\u2514\u2500\u2500 rs_lib_bg.wasm.d.ts\r\n<\/code><\/pre>\n
\u3053\u308c\u3067wasm\u30d5\u30a1\u30a4\u30eb\u306e\u4f5c\u6210\u306f\u5b8c\u4e86\u3067\u3059\u3002<\/p>\n
\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5b9f\u88c5\u3002<\/h1>\n
app.vue\u306b\u76f4\u63a5\u66f8\u3044\u3066\u3082\u3044\u3044\u6c17\u304c\u3057\u307e\u3059\u304c\u3001pages\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u6210\u3057\u3066\u305d\u3053\u306bindex.vue\u3092\u4f5c\u6210\u3059\u308b\u65b9\u5f0f\u3067\u3084\u3063\u3066\u307f\u307e\u3059\u3002
\napp.vue\u3092\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3057\u307e\u3059\u3002<\/p>\n
<<\/span>template<\/span>><\/span>\r\n  <div><\/span>\r\n    <NuxtPage<\/span> \/><\/span>\r\n  <\/div><\/span>\r\n<\/<\/span>template<\/span>><\/span>\r\n<\/code><\/pre>\n
\u65b0\u305f\u306bpages\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u3092\u4f5c\u6210\u3057\u3001\u76f4\u4e0b\u306bindex.vue\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002<\/p>\n
<<\/span>script<\/span> setup<\/span> lang=<\/span>\"ts\"<\/span>><\/span>\r\nimport<\/span> init<\/span>,<\/span> {<\/span> add<\/span> }<\/span> from<\/span> \"<\/span>rs_lib<\/span>\"<\/span>;<\/span>\r\n\r\nconst<\/span> two_numbers<\/span> =<\/span> ref<\/span><<\/span>{<\/span>a<\/span>:<\/span> number<\/span>,<\/span> b<\/span>:<\/span> number<\/span>}<\/span>><\/span>({<\/span>a<\/span>:<\/span> 0<\/span>,<\/span> b<\/span>:<\/span> 0<\/span>});<\/span>\r\nconst<\/span> sum<\/span> =<\/span> ref<\/span>(<\/span>0<\/span>);<\/span> \r\n\r\nonMounted<\/span>(<\/span>async <\/span>()<\/span> =><\/span> {<\/span>\r\n  await<\/span> init<\/span>();<\/span> \r\n});<\/span>\r\n\r\nconst<\/span> calculateSum<\/span> =<\/span> ()<\/span> =><\/span> {<\/span> \r\n  const<\/span> a<\/span> =<\/span> two_numbers<\/span>.<\/span>value<\/span>.<\/span>a<\/span>;<\/span>\r\n  const<\/span> b<\/span> =<\/span> two_numbers<\/span>.<\/span>value<\/span>.<\/span>b<\/span>;<\/span>\r\n  sum<\/span>.<\/span>value<\/span> =<\/span> add<\/span>(<\/span>a<\/span>,<\/span> b<\/span>);<\/span> \r\n};<\/span>\r\n\r\n<\/<\/span>script<\/span>><\/span>\r\n\r\n<<\/span>template<\/span>><\/span>\r\n    <div><\/span>\r\n        <h1><\/span>Nuxt3 * WebAssembly Demo <\/h1><\/span>\r\n        <input<\/span> type=<\/span>\"number\"<\/span> v-model=<\/span>\"two_numbers.a\"<\/span> \/><\/span>\r\n        <input<\/span> type=<\/span>\"number\"<\/span> v-model=<\/span>\"two_numbers.b\"<\/span> \/><\/span>\r\n        <button<\/span> @<\/span>click=<\/span>\"calculateSum\"<\/span>><\/span>Add<\/button><\/span>\r\n        <p><\/span>Sum calculated by WebAssembly: {{<\/span> sum<\/span> }}<\/span><\/p><\/span> \r\n    <\/div><\/span>\r\n<\/<\/span>template<\/span>><\/span>\r\n\r\n<\/code><\/pre>\n
vite-plugin-wasm-pack\u306b\u3088\u3063\u3066\u7c21\u5358\u306bwasm\u304c\u547c\u3073\u51fa\u305b\u308b\u3088\u3046\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n
yarn dev\u3067\u52d5\u4f5c\u78ba\u8a8d\u3057\u307e\u3059<\/p>\n
yarn dev\r\n<\/code><\/pre>\n
\"\u30b9\u30af\u30ea\u30fc\u30f3\u30b7\u30e7\u30c3\u30c8<\/div>\n
\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u30b5\u30a4\u30c9\u3067\u52a0\u7b97\u51e6\u7406\u304cwasm\u3067\u5b9f\u884c\u3055\u308c\u3001\u7d50\u679c\u304c\u8868\u793a\u3055\u308c\u3066\u307e\u3059\u3002<\/p>\n
\u307e\u3068\u3081<\/h1>\n
\u4eca\u56de\u306fnuxt3\u3068wasm\u3067\u8d85\u7d76\u30b7\u30f3\u30d7\u30eb\u306aweb\u30a2\u30d7\u30ea\u3092\u4f5c\u6210\u3057\u3066\u307f\u307e\u3057\u305f\u3002
\n\u6b21\u306f\u30b5\u30fc\u30d0\u30fc\u30b5\u30a4\u30c9\u3067\u51e6\u7406\u3055\u305b\u3066\u7d50\u679c\u3092\u8868\u793a\u3059\u308bSSR\u306e\u90e8\u5206\u3067\u3082wasm\u304c\u4f7f\u3048\u305f\u3089\u4f7f\u3063\u3066\u307f\u3088\u3046\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n","protected":false},"excerpt":{"rendered":"
\u5b8c\u6210\u54c1 \u3081\u3061\u3083\u304f\u3061\u3083\u7c21\u7d20\u3067\u3059\u304c\u3001\u4eca\u56de\u306fNuxt3\u3067Wasm\u3092\u52d5\u304b\u3059\u3068\u3044\u3046\u6700\u4f4e\u9650\u306e\u76ee\u6a19\u306e\u305f\u3081\u3054\u5bb9\u8d66\u304f\u3060\u3055\u3044\u3002 \u307e […]<\/p>\n","protected":false},"author":11,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-45419","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"\n- Blog - Silicon Cloud<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:description\" content=\"\u5b8c\u6210\u54c1 \u3081\u3061\u3083\u304f\u3061\u3083\u7c21\u7d20\u3067\u3059\u304c\u3001\u4eca\u56de\u306fNuxt3\u3067Wasm\u3092\u52d5\u304b\u3059\u3068\u3044\u3046\u6700\u4f4e\u9650\u306e\u76ee\u6a19\u306e\u305f\u3081\u3054\u5bb9\u8d66\u304f\u3060\u3055\u3044\u3002 \u307e […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:published_time\" content=\"2022-12-28T12:37:09+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-28T14:56:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d5e9537434c4406cf5abc\/1-0.png\" \/>\n<meta name=\"author\" content=\"\u65b0, \u97f5\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"\u65b0, \u97f5\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/\",\"name\":\"- Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\"},\"datePublished\":\"2022-12-28T12:37:09+00:00\",\"dateModified\":\"2024-04-28T14:56:00+00:00\",\"author\":{\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/\"]}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/\",\"name\":\"Blog - Silicon Cloud\",\"description\":\"\",\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9\",\"name\":\"\u65b0, \u97f5\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g\",\"caption\":\"\u65b0, \u97f5\"},\"url\":\"https:\/\/www.silicloud.com\/zh\/blog\/author\/yunxin\/\"},{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/#local-main-organization-logo\",\"url\":\"\",\"contentUrl\":\"\",\"caption\":\"Blog - Silicon Cloud\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"- Blog - Silicon Cloud","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/","og_locale":"zh_CN","og_type":"article","og_description":"\u5b8c\u6210\u54c1 \u3081\u3061\u3083\u304f\u3061\u3083\u7c21\u7d20\u3067\u3059\u304c\u3001\u4eca\u56de\u306fNuxt3\u3067Wasm\u3092\u52d5\u304b\u3059\u3068\u3044\u3046\u6700\u4f4e\u9650\u306e\u76ee\u6a19\u306e\u305f\u3081\u3054\u5bb9\u8d66\u304f\u3060\u3055\u3044\u3002 \u307e […]","og_url":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/","og_site_name":"Blog - Silicon Cloud","article_published_time":"2022-12-28T12:37:09+00:00","article_modified_time":"2024-04-28T14:56:00+00:00","og_image":[{"url":"https:\/\/cdn.silicloud.com\/blog-img\/blog\/img\/657d5e9537434c4406cf5abc\/1-0.png"}],"author":"\u65b0, \u97f5","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"\u65b0, \u97f5","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"2 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/","url":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/","name":"- Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website"},"datePublished":"2022-12-28T12:37:09+00:00","dateModified":"2024-04-28T14:56:00+00:00","author":{"@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/"]}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#website","url":"https:\/\/www.silicloud.com\/zh\/blog\/","name":"Blog - Silicon Cloud","description":"","inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/4ba4019495123db3038fd0809e6959c9","name":"\u65b0, \u97f5","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d484b6c6e4ae82e8a9efea989e1d2af46d9b6ef128101e63b18f559fca0ae627?s=96&d=mm&r=g","caption":"\u65b0, \u97f5"},"url":"https:\/\/www.silicloud.com\/zh\/blog\/author\/yunxin\/"},{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.silicloud.com\/zh\/blog\/45419-2\/#local-main-organization-logo","url":"","contentUrl":"","caption":"Blog - Silicon Cloud"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/45419","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/comments?post=45419"}],"version-history":[{"count":2,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/45419\/revisions"}],"predecessor-version":[{"id":63233,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/posts\/45419\/revisions\/63233"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/media?parent=45419"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/categories?post=45419"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/zh\/blog\/wp-json\/wp\/v2\/tags?post=45419"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}