question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Using import statement in app.config.js causes an error

See original GitHub issue

🐛 Bug Report

https://docs.expo.io/workflow/configuration/ tells me I can use import statements in app.config.js but it doesn’t work.

Summary of Issue (just a few sentences)

I wanted to use import Constants from 'expo-constants'; in app.config.js but it gives me an error

Environment - output of expo diagnostics & the platform(s) you’re targeting

Expo CLI 3.21.5 environment info:
    System:
      OS: macOS Mojave 10.14.6
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 12.12.0 - /usr/local/bin/node
      Yarn: 1.19.1 - /usr/local/bin/yarn
      npm: 6.11.3 - /usr/local/bin/npm
    IDEs:
      Android Studio: 3.6 AI-192.7142.36.36.6241897
      Xcode: 11.3.1/11C504 - /usr/bin/xcodebuild
    npmPackages:
      expo: ~37.0.3 => 37.0.8
      react: ~16.9.0 => 16.9.0
      react-dom: ~16.9.0 => 16.9.0
      react-native: https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz => 0.61.4
      react-native-web: ~0.11.7 => 0.11.7
    npmGlobalPackages:
      expo-cli: 3.21.5

Reproducible Demo

  • This should include as little code as possible, please don’t simply link your entire project
  • Sharing a link to a Snack is a GREAT way to provide a reproducible demo 😃
  • If a reproducible demo, or a complete list of steps from blank project to bug, are not provided, it is very likely your issue will be closed
  • If you need more guidance, please see https://stackoverflow.com/help/mcve

As an added benefit- creating a repro may help you identify the source of the bug, which means we are one step closer to fixing it! Thanks for helping us help you!

Steps to Reproduce

create app.config.js and add import Constants from 'expo-constants';

Expected Behavior vs Actual Behavior

expected the app runs without problems.

actual

/Users/swatanabe025/Desktop/private/OtsukaiChain/packages/clients/supporter/node_modules/expo-constants/build/Constants.js:1
import { AppOwnership, UserInterfaceIdiom, } from './Constants.types';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Module._compile (internal/modules/cjs/loader.js:892:18)
    at Module._compile (/usr/local/lib/node_modules/expo-cli/node_modules/pirates/lib/index.js:99:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:973:10)
    at Object.newLoader [as .js] (/usr/local/lib/node_modules/expo-cli/node_modules/pirates/lib/index.js:104:7)
    at Module.load (internal/modules/cjs/loader.js:812:32)
    at Function.Module._load (internal/modules/cjs/loader.js:724:14)
    at Module.require (internal/modules/cjs/loader.js:849:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Constants (/Users/swatanabe025/Desktop/private/OtsukaiChain/packages/clients/supporter/app.config.js:1:1)
    at Object.<anonymous> (/Users/swatanabe025/Desktop/private/OtsukaiChain/packages/clients/supporter/app.config.js:4:28)

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:8 (3 by maintainers)

github_iconTop GitHub Comments

10reactions
ShunyaWatanabecommented, Jun 19, 2020

@byCedric It’d be great if you can share with me how to achieve this in another way!

0reactions
donni106commented, Jan 13, 2022

i have changed my export const xyz = ... to module.exports.xyz = ... in the file i rely on. this way the import works in app.config.js and other stuff seems to behave like the way before 🤞

Read more comments on GitHub >

github_iconTop Results From Across the Web

SyntaxError: Cannot use import statement outside a module
The common source of the problem is the MIME-type for "Module" type JavaScript files is not recognized as a "module" type by the...
Read more >
Configuring Jest
For example, with the following configuration: JavaScript; TypeScript. /** @type {import('jest').Config} */
Read more >
Cannot use import statement outside a module [React ...
When building a web application, you may encounter the SyntaxError: Cannot use import statement outside a module error. This error might be ...
Read more >
How to Bundle JavaScript With Rollup — Step-by-Step Tutorial
Author your app or library using ES2015 modules, then efficiently bundle ... Next, create a new file called rollup.config.js in the learn-rollup folder....
Read more >
Config file processing in Spring Boot 2.4
With the latest milestone, you can use the new spring.config.import property directly in your application.properties or application.yml ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found