NativeScript+Angular项目中ng g c命令无法执行的问题

核心原因 #

NativeScript Angular项目的结构与标准Angular工作区存在差异，Angular CLI无法识别NativeScript项目的结构，因此直接执行ng命令会触发"outside a workspace"错误。

解决方案 #

1. 使用NativeScript CLI替代Angular CLI #

NativeScript提供了适配自身项目的生成命令，直接执行：

tns generate component welcome
# 或简写形式
tns g c welcome

这是NativeScript Angular项目生成组件的标准方式，无需依赖Angular CLI的工作区配置。

2. 确认当前目录为项目根目录 #

执行命令前先检查是否处于项目根目录，根目录应包含nativescript.config.ts、package.json等核心文件。如果不在根目录，切换到对应路径后再执行命令。

3. 手动配置Angular工作区（若需使用ng命令） #

如果坚持要使用ng命令，需要手动创建并配置Angular工作区文件：

• 在项目根目录创建angular.json文件，添加基础配置（示例）：

  {
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
      "your-project-name": {
        "root": "",
        "sourceRoot": "src",
        "projectType": "application",
        "schematics": {
          "@nativescript/schematics:component": {
            "styleext": "css"
          }
        }
      }
    },
    "cli": {
      "defaultCollection": "@nativescript/schematics"
    }
  }
  

• 将your-project-name替换为实际项目名称，之后重新执行ng g c welcome。

4. 清理依赖缓存重置环境 #

若之前的依赖安装存在冲突，执行以下步骤重置：

# 删除依赖目录和锁文件（Mac/Linux）
rm -rf node_modules package-lock.json
# Windows系统执行以下命令
# rmdir /s /q node_modules && del package-lock.json

# 重新安装依赖
npm install

内容的提问来源于stack exchange，提问作者A.P Markowits