add a symlink to module from project's node_modules

Question

I have a scss folder outside of /src folder in my project structure this is why react angry with bu

Failed to compile.

./src/index.js
Module not found: You attempted to import ../scss/style.scss which falls outside of the project src/ directory. Relative imports outside of src/ are not supported. You can either move it inside src/, or add a symlink to
it from project's node_modules/.

here is my index.js file:

import '../scss/style.scss'


ReactDOM.render(
<HashRouter>
    <Switch>
        <Route path="/" name="Home Page" component={Full}/>  
    </Switch>
</HashRouter>, 
    document.getElementById('root'));
registerServiceWorker();

and this is the content of style.scss file:

// Override Boostrap variables
@import "bootstrap-variables";

// Import Bootstrap source files
@import "node_modules/bootstrap/scss/bootstrap";

// Override core variables
@import "core-variables";

// Import core styles
@import "core/core";

// Custom styles
@import "custom";

I searched a lot and understood its not allowed to import it outside of /src directory.. how can I "add a symlink" as react suggest me to do or how can I fix it other way?

EDITED: if i move scss into /src folder:

./src/scss/style.scss
Module build failed:
undefined
^
      File to import not found or unreadable: bootstrap.
Parent style sheet: stdin
      in D:\Repositories\facereco\src\scss\style.scss (line 14, column 1)

Answer 1

If you want to do a symlink check the npm documentation. Here is about it https://docs.npmjs.com/cli/link

In short

• Go to dictionary with your package, in your case your scss file

cd ../scss

npm link

• Next go to some other location and:

npm link <your_package>

And you've got it!