Created
June 20, 2019 09:55
-
-
Save Kishanjvaghela/c6bfd3cde639735af5d6dfbf7c4a755d to your computer and use it in GitHub Desktop.
transformer for node modules
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
module.exports = { | |
/** | |
* Add search paths to the packager. Equivalent to the | |
* `--projectRoots` command line argument. | |
* | |
* Your app project directory is the default, but you can easily add | |
* additional directories. | |
* | |
* This is very handy when you maintain all your software in one big | |
* repo, which means your app's dependencies aren't necessarily just | |
* located in `./node_modules` but potentially in sibling | |
* directories or other locations. | |
*/ | |
getProjectRoots() { | |
return [__dirname]; | |
}, | |
/** | |
* Specify additional file extensions for assets. For example, if | |
* you want to include a .ttf file, you would return ['ttf'] from | |
* here and use `require('./fonts/example.ttf')` inside your app. | |
* | |
* Equivalent to the `--assetExts` command line argument. | |
*/ | |
getAssetExts() { | |
return []; | |
}, | |
/** | |
* Specify any additional platforms to be used by the packager. | |
* For example, if you want to add a "custom" platform, and use modules | |
* ending in .custom.js, you would return ['custom'] here. | |
* | |
* Equivalent to the `--platforms` command line argument. | |
*/ | |
getPlatforms() { | |
return []; | |
}, | |
/** | |
* The React Native packager can be a bit fussy. For instance, it | |
* does not like come across duplicate packages. It can also be slow | |
* to traverse deep directory structures that you know won't have | |
* app dependencies in them. Putting those directories on the | |
* blacklist will stop the packager from traversing into them. | |
*/ | |
getBlacklistRE() { | |
const blacklist = require('metro/src/blacklist'); | |
const additionalBlacklist = [ | |
/ignore-this-directory\/.*/, | |
]; | |
return blacklist(additionalBlacklist); | |
}, | |
/** | |
* This is the bombshell. New in React Native 0.30, this allows you | |
* to specify your own code transformer. | |
* | |
* In essense, instead of specifying your own `.babelrc` file, | |
* you'll want to specify your own transformer. That way, when | |
* running a regular node program such as the packager itself, the | |
* special transforms your app needs won't be applied. | |
* | |
* Equivalent to the `--transformer` command line argument. | |
*/ | |
getTransformModulePath() { | |
return require.resolve('./transformer'); | |
}, | |
}; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const babel = require('babel-core'); | |
/** | |
* This is your `.babelrc` equivalent. | |
*/ | |
const babelRC = { | |
presets: [require('babel-preset-react-native')], | |
plugins: [ | |
// The following plugin will rewrite imports. Reimplementations of node | |
// libraries such as `assert`, `buffer`, etc. will be picked up | |
// automatically by the React Native packager. All other built-in node | |
// libraries get rewritten to their browserify counterpart. | |
[require('babel-plugin-rewrite-require'), { | |
aliases: { | |
constants: 'constants-browserify', | |
crypto: 'react-native-crypto', | |
dns: 'node-libs-browser/mock/dns', | |
domain: 'domain-browser', | |
fs: 'node-libs-browser/mock/empty', | |
http: 'stream-http', | |
https: 'https-browserify', | |
net: 'node-libs-browser/mock/net', | |
os: 'os-browserify/browser', | |
path: 'path-browserify', | |
querystring: 'querystring-es3', | |
stream: 'stream-browserify', | |
_stream_duplex: 'readable-stream/duplex', | |
_stream_passthrough: 'readable-stream/passthrough', | |
_stream_readable: 'readable-stream/readable', | |
_stream_transform: 'readable-stream/transform', | |
_stream_writable: 'readable-stream/writable', | |
sys: 'util', | |
timers: 'timers-browserify', | |
tls: 'node-libs-browser/mock/tls', | |
tty: 'tty-browserify', | |
vm: 'vm-browserify', | |
zlib: 'browserify-zlib', | |
randombytes: 'react-native-randombytes', | |
bip39: 'react-native-bip39', | |
// tweetnacl: 'tweetnacl-rn', | |
// You can add your own, much like webpack aliases: | |
'corporate-lib': 'corporate-lib-react-native', | |
// You can also mock any libraries that you don't need to support on | |
// React Native, but have to be present for 3rd party code to work: | |
'some-third-party-dependency': 'node-libs-browser/mock/empty', | |
}, | |
throwForNonStringLiteral: true, | |
}], | |
], | |
}; | |
function transform({src, filename, options}) { | |
const babelConfig = Object.assign({}, babelRC, { | |
filename, | |
sourceFileName: filename, | |
}); | |
console.log('S================') | |
console.log(filename) | |
console.log('E================') | |
const result = babel.transform(src, babelConfig); | |
return { | |
ast: result.ast, | |
code: result.code, | |
map: result.map, | |
filename: filename, | |
}; | |
} | |
module.exports.transform = transform; | |
// module.exports.transform = function(data, callback) { | |
// let result; | |
// try { | |
// result = transform(data.sourceCode, data.filename, data.options); | |
// } catch (e) { | |
// callback(e); | |
// return; | |
// } | |
// callback(null, result); | |
// }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
rn-cli.config.js
andtransformer.js
in the root foldertransformer.js
usingnpm install <module-name> --save