Babel: невозможно использовать CSS (неожиданный токен) при использовании AWS Amplify - PullRequest
Новая
       69

Babel: невозможно использовать CSS (неожиданный токен) при использовании AWS Amplify

0 голосов
/ 16 апреля 2019

Я создаю приложение React с AWS Amplify.

Я тестирую свое приложение, используя RITEway . Чтобы использовать RITEway с React, мне нужно установить @babel/core @babel/polyfill @babel/preset-env @babel/register, а затем запустить тесты с: 

"test": "riteway -r @babel/register -r @babel/polyfill 'src/**/*.test.js' | tap-color"

.babelrc определяется следующим образом: 

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "targets": ["last 2 versions", "safari >= 7"]
      }
    ],
    "@babel/preset-react"
  ]
}

Я подключил компонент к graphql с помощью AWS Amplify и его вспомогательных методов AppSync: 

export default compose(
  graphqlMutation(gql(createContact), gql(listContacts), 'Contact'),
)(CreateContactButton);

Эта кнопка отображается как дочерний компонент в одном из тестов. Этот тест завершается с ошибкой, говоря, что в контексте компонента отсутствует client, который я исправляю, заключая его в <ApolloProvider /> в файле теста: 

describe('ContactList component', async assert => {
  const createContactList = (props = {}) =>
    render(
      <ApolloProvider client={client}>
        <Provider store={store}>
          <ContactList {...props} />
        </Provider>
      </ApolloProvider>
    );

Как только я это сделаю, тесты не пройдут: 

/Users/jan/dev/myapp/node_modules/@aws-amplify/ui/dist/style.css:13
:root {
^

SyntaxError: Unexpected token :
    at new Script (vm.js:79:7)
    at createScript (vm.js:251:10)
    at Object.runInThisContext (vm.js:303:10)
    at Module._compile (internal/modules/cjs/loader.js:657:28)
    at Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Object.newLoader [as .js] (/Users/jan/dev/myapp/node_modules/pirates/lib/index.js:104:7)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)

Я не могу изменить код усиления. Какие еще плагины Babel мне нужно добавить, чтобы избежать сбоев моих тестов при встрече с CSS? Или, в целом, как я могу избежать вавилонской аварии и заставить мои тесты запускаться?

...