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.

getSourceExts() breaks typical module resolution

See original GitHub issue

SCSS file gets loaded instead of the intended JS file.


When exporting an getSourceExts() as per the, the SCSS extensions take precedence before the normal js, json file extensions Metro looks up. See this relevant commit on the RN project.

When importing a local module without specifying an extension (perfectly valid use case as to allow for the platform specific file to get loaded) the bundler resolves the SCSS file first, the transformer produces JS code but the intended JS module is never imported. No error is raised until later, when some code tries to execute code from the “missed” module.

Issue Analytics

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

github_iconTop GitHub Comments

kristerkaricommented, May 4, 2018

I’m definitely open for any new features that can be added to the sass transformer. 👍

So far what has been holding me back has been lack of time and the fact that I haven’t found a good way to pass options to node-sass. The good news is that node-sass is open for adding a project config file (, which would allow the options to be defined outside of the transformer.

Just ping me if you want to discuss any specific features or if you have something ready that you want to contribute.

kristerkaricommented, May 4, 2018

I guess that for now I’ll just update the docs with your workaround, and let’s see if it’s possible to do a better fix for the issue.

It sucks that React Native gives such limited options for specifying options for Metro.

Read more comments on GitHub >

github_iconTop Results From Across the Web

getSourceExts not being respected when bundling · Issue #248
Metro appears to be not respecting the configuration defined in rn-cli.config.js module.exports = { getSourceExts: () => { return ['jsx', ...
Read more >
Module Resolution | Metro - Meta Open Source
Module resolution is the process of translating module names to module paths at build time. For example, if your project contains the code:...
Read more >
Can't resolve module (not found) in React.js - Stack Overflow
Console says that it can't find the module in the directory, but I've checked at least 10 times for typos. Anyways, here's the...
Read more >
Using TypeScript with React Native - Blog - Pusher
In this tutorial, we're going to take a look at how you can use TypeScript for building your React Native projects.
Read more >
Module resolution - RFC
This RFC formalizes the module resolution for LWC. It defines the way that we can resolve modules in all host environments (node, browser, ......
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 Post

No results found

github_iconTop Related Hashnode Post

No results found