trayio / babel-plugin-webpack-alias

babel 6 plugin which allows to use webpack resolve options
MIT License
150 stars 32 forks source link

Skip preserving file extension for generated path #25

Closed devarsh closed 8 years ago

devarsh commented 8 years ago

Babel would emit the files with js extension irrespective of the extension of source files, which would cause problem to test individual files without using webpack or gulp, since required modules path would never be resolved, becuase generated files would have an extension of js and the generated webpack alias path would be referring to jsx(i.e original extension)

I've shown an example to support the use case

.babelrc

{
  "presets": ["es2015", "react","stage-2"],
  "plugins" : [
  ["babel-plugin-webpack-alias", { "config": "./webpack/server/server.js" }]
  ],
}

webpack config

resolve : {
    extensions: ['','.js','.jsx'],
    modules : [srcPath,path.join(basePath,'./node_modules')],
    alias : {
      template: path.join(srcPath,'./template')
    },
  },

es6 code

import Layout from 'template/Layout';

Generating es5 file post babel transformation

src/server/template/Layout.jsx -> lib/server/template/Layout.js

Post babel transformation

var _Layout = require('./Layout.jsx'); //should be './Layout.js'
var _Layout2 = _interopRequireDefault(_Layout);

Running in node

Error: Cannot find module './Layout.jsx'
adriantoine commented 8 years ago

What I can do is adding an option noOutputExtension which, when set to true:

{
  "presets": ["es2015", "react","stage-2"],
  "plugins" : [
  ["babel-plugin-webpack-alias", { "noOutputExtension": true, "config": "./webpack/server/server.js" }]
  ],
}

would output all require statements without extensions:

var _Layout = require('./Layout');
var _Layout2 = _interopRequireDefault(_Layout);

Would that solve your issue?

devarsh commented 8 years ago

Yes, it would

On Thu, Sep 8, 2016, 2:51 PM Adrien Antoine notifications@github.com wrote:

What I can do is adding an option noOutputExtension which, when set to true:

{ "presets": ["es2015", "react","stage-2"], "plugins" : [ ["babel-plugin-webpack-alias", { "noOutputExtension": true, "config": "./webpack/server/server.js" }] ], }

would output all require statements without extensions:

var _Layout = require('./Layout');var _Layout2 = _interopRequireDefault(_Layout);

Would that solve your issue?

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/trayio/babel-plugin-webpack-alias/issues/25#issuecomment-245541794, or mute the thread https://github.com/notifications/unsubscribe-auth/AAnUA5rmE-ahtDAs0_UKwYcGcSUNEyfMks5qn9OlgaJpZM4J3thn .

adriantoine commented 8 years ago

Ok, I'm working on it now

devarsh commented 8 years ago

Thanks for such a quick response, and the plugin is minimal but very helpful.

On Thu, Sep 8, 2016, 2:56 PM Adrien Antoine notifications@github.com wrote:

Ok, I'm working on it now

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/trayio/babel-plugin-webpack-alias/issues/25#issuecomment-245542977, or mute the thread https://github.com/notifications/unsubscribe-auth/AAnUA0uThdts8rHsxJzk9O8d6d5xl1Ktks5qn9S-gaJpZM4J3thn .

adriantoine commented 8 years ago

Thanks! @devarsh

adriantoine commented 8 years ago

The change is made, I'll publish a new version

adriantoine commented 8 years ago

@devarsh It's just been released in v2.1.0!

devarsh commented 8 years ago

@adriantoine thanks alot, i'll check and revert back to you