Как правильно экспортировать модуль, чтобы vscode мог показать мой модуль в предложении [ctrl + space]? - PullRequest
Новая
       24

Как правильно экспортировать модуль, чтобы vscode мог показать мой модуль в предложении [ctrl + space]?

4 голосов
/ 18 июня 2019

У меня есть файл стиля настройки, например:

GlobalStyles.js

export const GlobalStyles={
  ViewContainer:{flex:1, justifyContent:'center', alignItems:'center'},
  Center:{justifyContent:'center', alignItems:'center'},
  FontNormal:15,
  FontMedium:18,
  FontLarge:28,
  FontHeader:38
}

module.export={GlobalStyles}

, и когда я использовал его в другом файле JS, скажем, Home.js.я хочу, чтобы vscode знал каждое Key:Value, которое я определил,

с теми экспортерами в GlobalStyles.js vscode, предлагающими стиль импорта, подобный этому: 

import { GlobalStyles } from '../Component/GlobalStyles';

, и мой ожидаемый результат - что-токак: 

import { ViewContainer, Center, FontMedium, [and so on]} from '../Component/GlobalStyles';

как разрешить vscode, подсказывающий мне Автоматический импорт foo из пути / в / GlobalStyles , когда я набираю foo ?где foo похоже на ViewContainer, Center, FontMedium, [and so on].

Ответы [ 2 ]

3 голосов
/ 22 июня 2019

Функция, о которой вы говорите, называется Автоматический импорт .Чтобы ответить на ваш вопрос, эта функция существует и работает по умолчанию в VSCode.

Вот пример того, как я использовал ее в проекте React.Здесь у меня есть компонент внутри папки с тем же именем.За пределами этой папки находится файл, который я назвал ModuleExports.js, и в настоящее время он имеет следующий код: 

import Navbar from "./Navbar/Navbar";

export { Navbar };

Для справки, экспорт - это псевдоним module.export, поэтому вы можете использовать их взаимозаменяемо.Это компонент, поэтому, когда я пытаюсь использовать его как таковой, вы можете видеть на скриншоте, что мне предлагается использовать импорт.

example import suggestion 1

То же самоеможет быть сделано, не будучи компонентом.Я объявлю testObject внутри того же файла ModuleExports.js и экспортирую его.

create a testObject

Тогда давайте посмотрим, поднимет ли intellisense.

it works

Вот так.Я надеюсь, что это помогает, и спрашиваю, хотите ли вы получить больше разъяснений или сталкиваетесь с проблемами.

0 голосов
/ 26 июня 2019

В этом случае ошибкой кажется использование динамического экспорта. Это старый CommonJs стиль. VSCode использует машинописные инструменты для статического анализа. Чтобы воспользоваться этим, вы должны использовать ES6 export .

CommonJs: module.export={GlobalStyles}

ES6-модули : export GlobalStyles

Существенная разница между двумя заключается в том, что вариант CommonJs является просто переменной, которая определяется во время выполнения. То есть. нет способа узнать, что вы экспортируете, без выполнения кода. ES6 export зарезервированное слово. Это конструкция, которая не может быть изменена после определения, что также означает, что ее определение типа может быть найдено без фактического выполнения кода.

Typescript, Babel и т. Д. Обеспечивают функциональную совместимость между двумя модульными системами, но по спецификации это две совершенно разные вещи.

...