create-as

v1.1.2

Published

3 months ago

AssemblyScript project initializer with bilingual (English/Chinese) support, enabling quick creation of WebAssembly projects via 'npm init as'

0High
0Medium
0Low

jvy

assemblyscript wasm webassembly project-generator initializer bilingual

create-as: AssemblyScript 项目初始化工具

create-as 是一款轻量的 AssemblyScript 项目初始化工具，支持通过 npm init as 快速创建可直接编译为 WebAssembly（Wasm）的项目结构，内置中英文双语支持，适配不同开发者的使用习惯。

🌟 核心特性

快捷调用：支持 npm init as <项目目录> 一键创建项目，符合 npm 初始化器规范
双语支持：初始化时可选择中文/英文，终端提示与生成文件注释同步切换
完整结构：自动生成 AssemblyScript 标准项目结构（源码、编译配置、测试、浏览器示例）
智能适配：自动识别当前使用的包管理器（npm/yarn/pnpm），生成对应命令脚本
即开即用：内置 add/multiply 示例函数，安装依赖后可直接编译、测试、预览

🚀 快速开始

1. 安装与创建项目

无需提前安装，直接通过 npm init 调用（支持 npm/yarn/pnpm）：

# 基础用法：创建名为 my-as-project 的项目（会提示选择语言）
npm init as my-as-project

# 进阶用法：在当前目录创建项目（自动确认所有选项，默认中文）
npm init as . -y

# 进阶用法：创建项目并禁用终端颜色输出
npm init as ./demo --no-colors

2. 语言选择

执行命令后（非 -y 模式），会提示选择项目语言：

请选择项目语言（默认：中文）
1. 中文（zh-CN）
2. 英文（en）
输入编号（1/2）或直接回车：

直接回车：使用默认语言（中文）
输入 1：选择中文（终端提示、文件注释均为中文）
输入 2：选择英文（终端提示、文件注释均为英文）

3. 项目结构

创建完成后，生成的项目结构如下（以中文为例）：

my-as-project/
├── assembly/                # AssemblyScript 源码目录
│   └── index.ts             # 入口文件（含 add/multiply 示例函数）
│   └── tsconfig.json        # TS 配置（继承 AssemblyScript 标准）
├── build/                   # Wasm 编译产物目录
│   └── .gitignore           # 忽略编译产物（仅保留 .gitignore）
├── tests/                   # 测试目录
│   └── index.js             # 测试文件（验证 Wasm 函数功能）
├── index.html               # 浏览器预览示例（加载并调用 Wasm）
├── asconfig.json            # AssemblyScript 编译配置（debug/release 目标）
└── package.json             # 项目配置（依赖、脚本命令）

📝 常用命令

项目创建后，可通过以下命令完成开发流程（根据选择的包管理器自动适配）：

| 命令 | 功能说明 | 示例（npm） | |-----------------------|-------------------------------------------|--------------------------| | 安装依赖 | 安装 AssemblyScript 等开发依赖 | npm install | | 编译 Wasm 模块 | 同时生成 debug（调试版）和 release（优化版） | npm run asbuild | | 仅编译 debug 版 | 生成带调试信息的 Wasm（便于开发调试） | npm run asbuild:debug | | 仅编译 release 版 | 生成优化后的 Wasm（体积更小、性能更好） | npm run asbuild:release| | 运行测试 | 执行测试用例，验证 Wasm 函数正确性 | npm test | | 浏览器预览 | 启动本地服务，预览 Wasm 在浏览器中的效果 | npm start |

⚙️ 命令行选项

| 选项 | 别名 | 功能说明 | |---------------------|-------|-------------------------------------------| | --help | -h | 显示帮助信息（含用法示例与选项说明） | | --yes | -y | 自动确认所有选项（跳过语言选择、创建确认）| | --no-colors | - | 禁用终端颜色输出（适合纯文本环境） | | --version | -v | 显示 create-as 当前版本 |

📋 示例代码

1. 源码示例（assembly/index.ts）

// AssemblyScript 入口文件（编译为 WebAssembly）
// 文档：https://www.assemblyscript.org

/**
 * 示例：两数相加（i32 = 32 位有符号整数）
 * @param a 第一个参数
 * @param b 第二个参数
 * @returns 两数之和
 */
export function add(a: i32, b: i32): i32 {
  return a + b;
}

/**
 * 扩展示例：两数相乘
 */
export function multiply(a: i32, b: i32): i32 {
  return a * b;
}

2. 测试示例（tests/index.js）

import assert from "assert";
import { add, multiply } from "../build/debug.js";

// 测试 add 函数（验证基础加法）
assert.strictEqual(add(1, 2), 3, "add(1,2) 应返回 3");
assert.strictEqual(add(-1, 5), 4, "add(-1,5) 应返回 4");

// 测试 multiply 函数（验证基础乘法）
assert.strictEqual(multiply(2, 3), 6, "multiply(2,3) 应返回 6");
assert.strictEqual(multiply(-2, 4), -8, "multiply(-2,4) 应返回 -8");

console.log("✅ 所有测试通过！");

3. 浏览器预览示例（index.html）

自动加载编译后的 Wasm 模块，并在页面中显示计算结果：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <title>AssemblyScript Wasm 示例</title>
  <script type="module">
    // 加载编译后的 Wasm 模块（ES Module 方式）
    import { add, multiply } from "./build/release.js";
    
    // 在页面中显示计算结果
    document.addEventListener("DOMContentLoaded", () => {
      const result = `
        <h2>AssemblyScript Wasm 示例</h2>
        <p>add(1, 2) = ${add(1, 2)}</p>
        <p>multiply(3, 4) = ${multiply(3, 4)}</p>
      `;
      document.body.innerHTML = result;
    });
  </script>
</head>
<body></body>
</html>

🎯 注意事项

项目目录要求：创建项目时，目标目录需为空（非空目录会报错，避免覆盖现有文件）
依赖安装：项目创建后需先执行 npm install（或 yarn install/pnpm install）安装依赖，否则无法编译
浏览器预览：npm start 依赖 serve 工具（自动通过 npx 调用，无需额外安装）
AssemblyScript 版本：默认安装最新稳定版 AssemblyScript，如需指定版本，可手动修改 package.json 中的 devDependencies.assemblyscript

📚 相关资源

AssemblyScript 官方文档：学习 AssemblyScript 语法与 Wasm 编译细节
WebAssembly 官方指南：了解 Wasm 技术原理与应用场景
AssemblyScript GitHub：获取 AssemblyScript 源码与更新日志

🐛 问题反馈

如遇到功能异常、文案错误或需求建议，可通过以下方式反馈：

在项目仓库提交 Issue（如需开源）
联系工具维护者：[你的联系方式，如邮箱/GitHub 账号]

📄 许可证

MIT License
可自由使用、修改和分发，限于 MIT 许可证条款。