javiertury / babel-plugin-transform-import-meta Goto Github PK
View Code? Open in Web Editor NEWLicense: Other
License: Other
Hi,
given the original code like:
const __filename = fileURLToPath(import.meta.url)
(so, using the commonjs
's reserved word __filename
as the variable name, which works normally on modules
), will produce this line:
var __filename = (0, _url.fileURLToPath)(require('url').pathToFileURL(__filename).toString());
which will raise later the runtime error:
TypeError: The "path" argument must be of type string. Received undefined
Would be easy for babel-plugin-transform-import-meta
to detect if __filename
is being used as local variable name in the original code? If so, it would be great if it handled to auto-rename that variable! But this could be dangerous, so, at least, I would suggest to show some warning/error at transpiling time about this issue.
How feasible is this?
Thanks!
babel-plugin-transform-import-meta
combined with createRequire
seems to create a situation where _require
is being used before it's defined.
I have simple simple mjs:
import { createRequire } from 'module';
const require = createRequire( import.meta.url );
export default require( '../package.json' ).version;
When I use babel-plugin-transform-import-meta
in my babel --config-file ./.babelrcForBuild.json src -d dist
command I get a weird self-reference for _require
:
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _module = require("module");
var _require = (0, _module.createRequire)(_require('url').pathToFileURL(__filename).toString());
var _default = _require('../package.json').version;
exports["default"] = _default;
The problem is that _require
is being used before it's defined.
I can manually edit that file to change (_require('url').
to (require('url').
, but I'd like to avoid haivng to manually make changes if possible
Any tips for me here? Thanks!
Hello. I get the following error when I use your plugin:
TypeError: url__WEBPACK_IMPORTED_MODULE_0__.pathToFileURL is not a function
Hi, I am trying to get @testing-library/svelte running using Sveltekit and Vite 2. Not sure whether it's a jest issue.
Transpiling ESM works, but the import.meta
seems to contain only url
object, as per error:
TypeError: Cannot read property 'VITE_API_URL' of undefined
const url = import.meta.env.VITE_API_URL;
.babelrc
{
"presets": [
[
"@babel/preset-env",
{
"targets": {
"node": "current"
}
}
]
],
"plugins": ["babel-plugin-transform-import-meta"]
}
package.json
{
...
"devDependencies": {
"@babel/core": "^7.13.15",
"@babel/plugin-transform-modules-commonjs": "^7.13.8",
"@babel/preset-env": "^7.13.15",
"@sveltejs/adapter-node": "next",
"@sveltejs/kit": "next",
"@testing-library/jest-dom": "^5.11.10",
"@testing-library/svelte": "^3.0.3",
"@typescript-eslint/eslint-plugin": "^4.19.0",
"@typescript-eslint/parser": "^4.19.0",
"babel-jest": "^26.6.3",
"babel-plugin-transform-import-meta": "^1.0.1",
"eslint": "^7.22.0",
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-svelte3": "^3.1.0",
"jest": "^26.6.3",
"prettier": "~2.2.1",
"prettier-plugin-svelte": "^2.2.0",
"sass": "^1.0.0",
"svelte": "^3.29.0",
"svelte-jester": "^1.4.0",
"svelte-preprocess": "^4.0.0",
"tslib": "^2.0.0",
"typescript": "^4.0.0",
"vite": "^2.1.0"
},
"type": "module",
"engines": {
"node": ">= 12.17.0"
},
"jest": {
"transform": {
"^.+\\.js$": "babel-jest",
"^.+\\.svelte$": "svelte-jester"
},
"moduleNameMapper": {
"^\\$api/(.*)": "<rootDir>/src/api/$1",
"^\\$app/(.*)": [
"<rootDir>/.svelte/dev/runtime/app/$1",
"<rootDir>/.svelte/build/runtime/app/$1"
],
"^\\$components/(.*)": "<rootDir>/src/components/$1",
"^\\$lib/(.*)": "<rootDir>/src/lib/$1",
"^\\$service-worker": "<rootDir>/.svelte/build/runtime/service-worker",
"^\\$stores/(.*)": "<rootDir>/src/stores/$1"
},
"moduleFileExtensions": [
"js",
"svelte"
],
"setupFilesAfterEnv": [
"@testing-library/jest-dom/extend-expect"
]
}
After updating @babel/core in our app from 7.16.7 to 7.16.10 (and afterwards), I suddenly get this error when building with the following simple config:
Versions:
"@babel/core": "7.17.0",
"@babel/eslint-parser": "~7.17.0",
"@babel/preset-env": "~7.16.11",
Babel config used:
import { transformFileAsync } from '@babel/core';
let babelConfig = {
presets: ['@babel/preset-env'],
plugins: ['babel-plugin-transform-import-meta'],
targets: 'node >= 14',
}
let convertedFile = await transformFileAsync(inputFile, babelConfig);
Error:
TypeError: /my-app/tmp/index.js: ast is not a function
at PluginPass.Program (file:///my-app/node_modules/babel-plugin-transform-import-meta/lib/index.esm.mjs:40:38)
at newFn (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/visitors.js:177:21)
at NodePath._call (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/path/context.js:53:20)
at NodePath.call (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/path/context.js:40:17)
at NodePath.visit (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/path/context.js:100:31)
at TraversalContext.visitQueue (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/context.js:103:16)
at TraversalContext.visitSingle (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/context.js:77:19)
at TraversalContext.visit (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/context.js:131:19)
at traverseNode (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/traverse-node.js:24:17)
at traverse (/my-app/node_modules/@babel/core/node_modules/@babel/traverse/lib/index.js:62:34) {
code: 'BABEL_TRANSFORM_ERROR'
}
After looking at it, it seems that this in lib/index.esm.mjs
:
import template from '@babel/template';
console.log(template); // -->
{
default: [Function: bound ] {
smart: [Function (anonymous)] { ast: [Function: ast] },
statement: [Function (anonymous)] { ast: [Function: ast] },
statements: [Function (anonymous)] { ast: [Function: ast] },
expression: [Function (anonymous)] { ast: [Function: ast] },
program: [Function (anonymous)] { ast: [Function: ast] },
ast: [Function: ast]
},
expression: [Function (anonymous)] { ast: [Function: ast] },
program: [Function (anonymous)] { ast: [Function: ast] },
smart: [Function (anonymous)] { ast: [Function: ast] },
statement: [Function (anonymous)] { ast: [Function: ast] },
statements: [Function (anonymous)] { ast: [Function: ast] }
}
No idea why there is a default
thing in there, and why ast
would only be on that default
property ๐ค
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.