Posts

Showing posts with the label Babeljs

Cannot Import .tsx File From .ts File (and Vice Versa)

Answer : When you write import WriteEditor from './write_editor'; Webpack will automatically look for ./write_editor ./write_editor.js ./write_editor.json (And a few others) Since you're using .ts and .tsx , you need to tell it to look for those too in your Webpack config using resolve.extensions : { resolve: { extensions: [".js", ".json", ".ts", ".tsx"], }, } In my case, I got same error when using typescript-eslint . It is an app created by create-react-app . The way is by adding this code in .eslintrc.js . module.exports = { // ... settings: { 'import/resolver': { 'node': { 'extensions': ['.js','.jsx','.ts','.tsx'] } } } };

Confused About UseBuiltIns Option Of @babel/preset-env (using Browserslist Integration)

Answer : 1) Do I need to use that useBuiltIns: "entry" option? Yes, if you want to include polyfills based on your target environment. TL;DR There're basically 3 options for useBuiltIns : "entry" : when using this option, @babel/preset-env replaces direct imports of core-js to imports of only the specific modules required for a target environment. That means you need to add import "core-js/stable"; import "regenerator-runtime/runtime"; to your entry point and these lines will be replaced by only required polyfills. When targeting chrome 72, it will be transformed by @babel/preset-env to import "core-js/modules/es.array.unscopables.flat"; import "core-js/modules/es.array.unscopables.flat-map"; import "core-js/modules/es.object.from-entries"; import "core-js/modules/web.immediate"; "usage" : in this case polyfills will be added automatically when the usage of some feature is unsupported ...