Ember 快速入门：将 JS 文件添加到第一个组件时找不到模块“@glimmer/component”

Question

我刚开始使用 Ember。我已经遇到了 Ember Quickstart tutorial 的一些问题，它描述了组件的 hbs 和 js 文件都应该放在 app/components 中。它在我的机器上工作的唯一方法是 app/components 中的 js 文件，但 app/templates/components 中的 hbs 文件。这也是 ember generate component people-list 所做的。

现在，还有一个问题：people-list.js中的第一行是

import Component from '@glimmer/component';

这会导致错误 Could not find module @glimmer/component imported from ember-quickstart/components/people-list。没有构建错误，但组件的内容没有呈现。我该怎么办？

编辑 1：在中提到了 Ember Octane。这是 ember -v:

的输出

ember-cli: 3.18.0
node: 11.13.0
os: darwin x64

edit 2 下面是添加glimmer后的my package.json。我可以运行 npm install，但是 yarn install 给了我 The engine "node" is incompatible with this module. Expected version "10.* || >= 12". Got "11.13.0".

{
  "name": "ember-quickstart",
  "version": "0.0.0",
  "private": true,
  "description": "Small description for ember-quickstart goes here",
  "repository": "",
  "license": "MIT",
  "author": "",
  "directories": {
    "doc": "doc",
    "test": "tests"
  },
  "scripts": {
    "build": "ember build",
    "lint:hbs": "ember-template-lint .",
    "lint:js": "eslint .",
    "start": "ember serve",
    "test": "ember test"
  },
  "devDependencies": {
    "@ember/jquery": "^0.5.2",
    "@ember/optional-features": "^0.6.3",
    "broccoli-asset-rev": "^2.7.0",
    "ember-ajax": "^5.0.0",
    "ember-cli-app-version": "^3.2.0",
    "ember-cli-babel": "^7.1.2",
    "ember-cli-dependency-checker": "^3.1.0",
    "ember-cli-eslint": "^4.2.3",
    "ember-cli-htmlbars": "^3.0.0",
    "ember-cli-htmlbars-inline-precompile": "^1.0.3",
    "ember-cli-inject-live-reload": "^1.8.2",
    "ember-cli-sri": "^2.1.1",
    "ember-cli-template-lint": "^1.0.0-beta.1",
    "ember-cli-uglify": "^2.1.0",
    "ember-data": "~3.9.0",
    "ember-export-application-global": "^2.0.0",
    "ember-load-initializers": "^1.1.0",
    "ember-maybe-import-regenerator": "^0.1.6",
    "ember-qunit": "^3.4.1",
    "ember-resolver": "^5.0.1",
    "ember-source": "~3.9.0",
    "ember-welcome-page": "^3.2.0",
    "eslint-plugin-ember": "^5.2.0",
    "loader.js": "^4.7.0",
    "qunit-dom": "^0.8.0"
  },
  "engines": {
    "node": "10.* || >= 12"
  },
  "dependencies": {
    "ember-cli": "^3.18.0",
    "@glimmer/component": "^1.0.0"
  }
}

现在上面描述的问题消失了，取而代之的是 people-list.js 的第 5 行 Parsing error: Unexpected character '@':

import Component from '@glimmer/component';
import { action } from '@ember/object';

export default class PeopleListComponent extends Component {
  @action
  showPerson(person) {
    alert(`The person's name is ${person}!`);
  }
}

Answer 1

请确保 "@glimmer/component": "^1.0.0" 行存在于您的 package.json 中。然后重新运行 npm install 或 yarn install 并重新启动 ember s。如果您将 ember new 与 Ember 3.14+ 一起使用，则应该存在，但它似乎可能丢失了。

Ember 快速入门：将 JS 文件添加到第一个组件时找不到模块“@glimmer/component”

Ember Quickstart: could not find module `@glimmer/component` when adding JS file to first component

javascript

ember.js