TypeScript, SyntaxError: неожиданный токен {

Я пытаюсь запустить свою программу, используя «node main.js», однако она продолжает появляться с ошибкой «SyntaxError: Unexpected token {»

D:\Visual Studio Code Projects\ts-hello>node main.js
D:\Visual Studio Code Projects\ts-hello\main.js:1
import { LikeComponent } from './like.component';
       ^

SyntaxError: Unexpected token {
    at Module._compile (internal/modules/cjs/loader.js:721:23)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
    at Module.load (internal/modules/cjs/loader.js:653:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
    at Function.Module._load (internal/modules/cjs/loader.js:585:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:829:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)

Я попытался изменить файл tsconfig.json на «module»: «commonjs», однако это не сработало. Я даже удалил и переустановил узел и начал с нуля.

import{LikeComponent} from './like.component';

let component = new LikeComponent(10, true);
component.onClick();
console.info(`likesCount: ${component.likesCount}, isSelected: ${component.isSelected}`);

Программа должна правильно выводиться в командную строку.

Используйте опцию компилятора "module": "commonjs" в tsconfig.json. Затем снова скомпилируйте.

Paleo 11.06.2019 17:06

Не могли бы вы уточнить, что вы подразумеваете под параметром компилятора? Я уже зашел в файл конфигурации и изменил модуль на «модуль»: «commonjs»,

GolfBravo 11.06.2019 17:57
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
5
2
11 990
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Ответ принят как подходящий

Обратите внимание, что вы работаете node main.js.

Ваш main.js в настоящее время имеет синтаксис esm (также известный как синтаксис модуля ES6).

Предполагая, что он скомпилирован из main.ts, вам нужно иметь module: commonjs в вашем `tsconfig.json

// tsconfig.json
{
  "compilerOptions": {
    "module": "commonjs",
    ... // other configurations
  }
}

При этом, когда вы скомпилируете свой код, запустив tsc, он создаст main.js с синтаксисом модуля commonjs.

Если вы пытаетесь отлаживать проект vscode и у вас уже есть "module": "commonjs",, проверьте свой «launch.json» outFiles, чтобы убедиться, что он совпадает с фактическим расположением ваших выходных файлов (обычно устанавливается через outDir):

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/src/index.ts",
      "preLaunchTask": "tsc: build - tsconfig.json",
      "outFiles": ["${workspaceFolder}/build/**/*.js"], //make sure this matches!
      "sourceMaps": true
    }
  ]
}

Похоже, что если vscode не находит соответствующий файл, он просто пытается запустить файл ts через узел (что объясняет ошибку).

Я просто некоторое время бился над этим, так что, надеюсь, это спасет кого-то еще от головной боли.

Ошибки такого рода возникают из-за различий в синтаксисе между версиями Javascript/ECMAScript. Их можно избежать, используя конфигурации, найденные в @tsconfig/bases репозиторий github, которые являются рекомендовано командой TypeScript. Просто убедитесь, что вы используете соответствующий tsconfig для среды, в которой предназначен Javascript.

Базы TSConfig доступны для установки в NPM. Установите, а затем расширьте @tsconfig/node12/tsconfig.json следующим образом:

npm install --save-dev @tsconfig/node12

{
  "extends": "@tsconfig/node12/tsconfig.json",
  "compilerOptions": {
    ...
  },
  ...
}

Другие вопросы по теме