-
-
Notifications
You must be signed in to change notification settings - Fork 33
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Babel transpiler always fails #13
Comments
Hi there. Thanks for submitting this issue! (1) Interesting. When all you provide is simply (2) The issue you are experiencing sounds like it is related to #10. If you export something from a module which in turn also exports something from another one, declarations won't be emitted. If that's what's going on here, then that will be covered by the linked issue, but if not, then yes, a separate issue will be better :-) |
Hey, thanks for the quick response! Here is my babel.config.js (which is in the root directory of the project): module.exports = api => {
var isEnvDevelopment = api.env() === "development";
var isEnvProduction = api.env() === "production";
var isEnvTest = api.env() === "test";
console.log("api", api.env()); // development
return {
presets: [
isEnvTest && ["@babel/env", { targets: "node 10" }],
(isEnvProduction || isEnvDevelopment) && "@babel/env",
"@babel/preset-react",
"@babel/preset-typescript"
].filter(Boolean),
plugins: [
["@babel/plugin-proposal-class-properties", { loose: true }],
["@babel/plugin-proposal-object-rest-spread", { loose: true }],
"@babel/plugin-transform-object-assign",
"@babel/plugin-transform-runtime"
]
};
}; I added a trace to the first function in the babel stack at buildPresetChain (C:\Project\node_modules\@babel\core\lib\config\config-chain.js:47:11)
at loadPresetDescriptor (C:\Project\node_modules\@babel\core\lib\config\full.js:235:44)
at config.presets.reduce (C:\Project\node_modules\@babel\core\lib\config\full.js:77:21)
at Array.reduce (<anonymous>)
at recurseDescriptors (C:\Project\node_modules\@babel\core\lib\config\full.js:74:38)
at loadFullConfig (C:\Project\node_modules\@babel\core\lib\config\full.js:108:6)
at Object.loadOptions (C:\Project\node_modules\@babel\core\lib\config\index.js:27:36)
at getBabelConfig (C:\Project\node_modules\@wessberg\rollup-plugin-ts\dist\cjs\index.js:3782:18)
at Object.options (C:\Project\node_modules\@wessberg\rollup-plugin-ts\dist\cjs\index.js:5332:35)
at applyOptionHook (C:\Project\node_modules\rollup\dist\rollup.js:18404:31) So, it seems like the issue has to do with the options passed to the function
options { cwd: 'C:\\Project',
root: 'C:\\Project',
babelrc: false,
configFile: false,
passPerPreset: false,
envName: 'development',
filename: undefined,
plugins:
[ ConfigItem {
value: [Function],
options: [Object],
dirname: 'C:\\Project',
name: undefined,
file: [Object] },
ConfigItem {
value: [Function],
options: [Object],
dirname: 'C:\\Project',
name: undefined,
file: [Object] },
ConfigItem {
value: [Function],
options: undefined,
dirname: 'C:\\Project',
name: undefined,
file: [Object] },
ConfigItem {
value: [Function],
options: undefined,
dirname: 'C:\\Project',
name: undefined,
file: [Object] } ],
presets:
[ ConfigItem {
value: [Function],
options: undefined,
dirname: 'C:\\Project',
name: undefined,
file: [Object] },
ConfigItem {
value: [Function],
options: undefined,
dirname: 'C:\\Project',
name: undefined,
file: [Object] },
ConfigItem {
value: [Function],
options: undefined,
dirname: 'C:\\Project',
name: undefined,
file: [Object] } ] } And for the second point, it sounds like might be the same issue, the two files in question are: // Button/Button.tsx
import React from "react";
import classNames from "classnames";
import MuiButton from "@material-ui/core/Button";
import withStyles, { WithStyles } from "@material-ui/core/styles/withStyles";
import { Theme } from "@material-ui/core/styles/createMuiTheme";
import { MUI_COLOR } from "../../constants";
import { Color } from "../../constants/interfaces";
import createStyles from "@material-ui/core/styles/createStyles";
import { PropTypes } from "@material-ui/core";
declare module "@material-ui/core/styles/createPalette" {
interface Palette {
success: PaletteColor;
}
interface PaletteOptions {
success?: SimplePaletteColorOptions;
}
}
export const styles = (theme: Theme) =>
createStyles({
success: {
backgroundColor: theme.palette.success.light,
"&:hover": {
backgroundColor: theme.palette.success.main
},
"&:focus": {
backgroundColor: theme.palette.success.main
},
"&:active": {
borderColor: "transparent",
backgroundColor: theme.palette.success.dark
}
}
});
interface ButtonProps extends WithStyles<typeof styles> {
disabled?: boolean;
className?: string;
color: Color;
variant?: "text" | "outlined" | "contained";
}
const Button: React.FunctionComponent<ButtonProps> = ({
color,
classes,
disabled,
children,
className,
...props
}) => {
const muiColor = (MUI_COLOR.includes(color)
? color
: "default") as PropTypes.Color;
return (
<MuiButton
color={muiColor}
variant="contained"
disabled={disabled}
className={classNames(className, {
[classes.success]: color === "success"
})}
{...props}
>
{children}
</MuiButton>
);
};
export default withStyles(styles)(Button); and // Button/index.ts (which is missing the type definitions).
// It may also be useful to know that this file is one of the rollup entry points
export { default } from "./Button"; |
…b/RegExp matching patterns as well as deduping and merging of config options. #13
I've investigated (1) and released a fix this evening! It has been published on NPM as v1.1.42. Your babel config should work just fine from now on :-) Now, for (2): Without multiple entry points, I just tested with a simple file structure such as the following: // index.ts is the entry
export { default } from "./Button"; // ./Button.ts
export default class Button {} The generated type declarations looks like the following: // Generated declarations
class Button {
}
export { Button as default }; So under those circumstances, it looks just fine. As far as I can tell, the issue you are experiencing is related to the interoperability between |
I've fixed (2) in commit: 5c9c244 and published a new version on NPM (v1.1.43). Every |
I can confirm that babel is now working as expected, thanks for the quick turn around on it. I still have issues with multiple entries (I'm not using the plugin but rather multiple inputs from Rollup itself). This is my rollup.config.js: import del from "rollup-plugin-delete";
import ts from "@wessberg/rollup-plugin-ts";
export default [
{
input: {
index: "src/index.ts",
Button: "src/atoms/Button/index.ts"
},
output: [
{
dir: "dist/cjs",
format: "cjs",
sourcemap: true
},
{
dir: "dist/esm",
format: "esm",
sourcemap: true
}
],
external: ["react", "react-dom"],
plugins: [
del({ targets: ["dist/*"] }),
ts({
transpiler: "babel"
})
]
}
]; But I think since the issues are unrelated I should close this one and open a new one. |
First of all, thanks for writing this library! It is very useful for generating typings, especially with multiple entry points. I am however running into an issue when trying to use babel as a transpiler, I always get the same error message:
Error: [BABEL] unknown: Configuration contains string/RegExp pattern, but no filename was passed to Babel
with the stack trace:
I've seen this issue when trying with multiple rollup entry points as well as a single entry point. Everything seems to work fairly well when I remove babel but I am missing some transforms.
The config that has the issue is just the basic one from the README:
P.S. Not sure if it's related to the babel transform missing but when I have a file that contains only a re-export like this:
export { default } from "./Button";
the typings generated for it are blank. Is this normal or should I open a separate issue for it?
The text was updated successfully, but these errors were encountered: