I am working with a react js project. i am using webpack and redux with that. Here is the folder structure of my project.

-assets
-src  
 -ponent   
  -index.jsx  
 -container   
  -index.jsx

For now i want to use dynamic className for the index.jsx files according to their working directory name. Example:

for index.jsx in the folder ponent, the className will be

src-ponent

for index.jsx in the folder container, the className will be

src-ponent

I have tried to use npm module path for that. But the __dirname gives the output of the url of the browser '/'. How can i get that pwd from the jsx file.

I am working with a react js project. i am using webpack and redux with that. Here is the folder structure of my project.

-assets
-src  
 -ponent   
  -index.jsx  
 -container   
  -index.jsx

For now i want to use dynamic className for the index.jsx files according to their working directory name. Example:

for index.jsx in the folder ponent, the className will be

src-ponent

for index.jsx in the folder container, the className will be

src-ponent

I have tried to use npm module path for that. But the __dirname gives the output of the url of the browser '/'. How can i get that pwd from the jsx file.

• javascript
• reactjs
• path
• webpack

Share Improve this question Follow edited Aug 12, 2016 at 10:04 Rafi Ud Daula Refat asked Aug 12, 2016 at 9:14 Rafi Ud Daula RefatRafi Ud Daula Refat 2,2572020 silver badges2828 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

By default, webpack mocks Node's __dirname to "/". You can enable the real dirname by adding the following to your webpack configuration:

node: {
    __dirname: true
},

After that, __dirname will be set, relative to the resolve context in your webpack configuration.