Comments (7)
heads up: make sure you use 7.17.2 as there was a bug in 7.17.0
from babel-plugin-codegen.
Cool! I'd be willing to merge a pull request for this. I don't have time to work on it personally though.
from babel-plugin-codegen.
Great, so I've taken a look at the internals of this package to figure out how this would be implemented, and I can imagine a few potential approaches, but here's what I'm thinking might be best:
in getReplacement
helper it seems like codegen module may export a function and receive args:
babel-plugin-codegen/src/helpers.ts
Line 48 in 5e8d0ac
This seems like an ideal place to inject the babel core function addExternalDependency
as a function argument to be invoked dynamically inside the codegen script.
So the example from #49 OP might look more like this:
// @codegen
export default ({ addExternalDependency }) => {
const join = require('lodash/join')
const replace = require('lodash/replace')
const glob = require('glob')
const path = require('path')
const examplesFiles = glob.sync(path.resolve(__dirname, '**/examples.*'))
examplesFiles.forEach(addExternalDependency)
return `export default {
${join(examplesFiles.map((exampleFile) => {
const chopSrcFromPath = replace(exampleFile, /(.*):?src\//, '')
return `'${chopSrcFromPath}': require('./${chopSrcFromPath}')`
}), ',\n')}
}`
}
Does that make sense to you or do you have any better ideas? I'm not entirely sure how args
is supposed to be used currently so if this doesn't play nice with existing functionality that would be an issue.
from babel-plugin-codegen.
I suppose that makes sense for the comment form. We may need a different approach for the other forms though. I wonder if we could just reference it as a global variable instead?
from babel-plugin-codegen.
Okay I'll have to do more research on how babel-plugin-codegen works in its other forms then, because I've only used it in the comment form.
A global variable would probably work and is something I had considered but it did seem a little smelly to me. I'm also not sure if it's possible to set it up so that every separate dynamic/codegen file would have its own local instance of the global variable, because addExternalDependency
could be invoked by multiple dynamic/codegen files, and each file should have its own differentiated set of dependencies.
So I imagine there's got to be a way to declare a global variable so that it will only be available within the execution context of building/codegen-ing one file... so each file would have its own set of 'external dependencies'.
Do you think you could share a simple example of how you're imagining a global variable could be used for some of the forms other than the comment form?
Another option may be to not support addExternalDependency
in every form of babel-plugin-codegen initially — not sure how you feel about that tho.
from babel-plugin-codegen.
Everything about compiler plugins is "smelly" 😅 I honestly think it's the cleanest solution. I wonder whether it would be bad to call addExternalDependency
with the same file multiple times. If it is bad in practice you could have your own global that keeps track of the calls and only calls the actual function with unique values.
As an example (from the README):
import /* codegen(3) */ './assign-identity'
The assign-identity
module could simply call addExternalDependency
for any deps it has.
Heck, maybe even overloading the global require
would be interesting so folks wouldn't have to call it manually 🤔
But this is as much thinking as I have to dedicate to something that I'm never going to use. Good luck!
from babel-plugin-codegen.
I tried implementing this but it seems like external dependencies must be added before the plugin is returned and registered to babel (e.g. right here:
babel-plugin-codegen/src/index.ts
Line 14 in 5e8d0ac
So that leads me to the assumption that this feature proposal will not be possible with the current version of the caching feature of babel... However, I'm hoping I'm wrong and that someone more familiar with babel core will prove me wrong eventually, or the babel caching will be updated to support dynamic cache deps.
FTR The specific error is closely related to this open issue babel/babel#14252
It seems like the babel cache/deps are intented only to be used for a static set of files, all of which are known at plugin definition time, and can not be dynamic, and can not be delayed until compile time.
from babel-plugin-codegen.
Related Issues (17)
- codegen seems to be running before other plugins regardless of order? HOT 9
- Import lots of variables in a single line of code HOT 2
- Potential next steps? ("codegen-preval-core", dynamic identifier name) HOT 2
- Property value expected type of string but got null HOT 2
- Doesn't work if config is in "babel.config.js" file HOT 4
- In React Native code generation happens only on restarting server with cleaning the cache HOT 2
- How to return object literal? HOT 3
- Cannot get past "Must module.exports a string." HOT 11
- SyntaxError when a single import/export statement is used HOT 4
- Stale imports when running in watch mode HOT 2
- BABEL error when configuring with babel.config.js and with typescript preset HOT 2
- Output duplicated CommentBlock HOT 5
- Add support for full module resolution in require & import
- Add link to blog post HOT 3
- import() is not supported HOT 1
- Dynamic import() does not work HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from babel-plugin-codegen.