推荐最新

开发eslint自定义规则时，报错 Unexpected token < ,该如何解决？

开发eslint自定义规则时，我测试的代码是 , "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/cbdcce577f7c0c5f3919457454aa4eae.png) 运行 yarn run test，报错说 AssertionError [ERR_ASSERTION]: A fatal parsing error occurred: Parsing error: Unexpected token <，如下图 "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/892cd50d914920c4c454e821c9baf4bb.png) 是因为解析有问题吗？安装和配置了babel-eslint，仍然有这个问题 "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/0675328e967380d00ff99fda3ddd03db.png)

浏览量213

世界唯一的

es6代码,如何查看babel 转换为ES5之后的结果?

这样一段ES6的代码, 如何查看babel 转换为ES5之后的结果? class Person {} function f(cls) { return class Student {}; } console.log(f(Person)); 1. 在这个网站 "demo" (https://link.segmentfault.com/?enc=JFdxnl8nmQ9ABR6KdHihKw%3D%3D.L8pYzbcPhe82Vaes0Iunh7HMoCIGkTKivPD%2Ba0GDdNK1btupdpyAbh5%2FFtf0l74juIeiKaSY7WR3fj5kfo65PWgdCvXgToOA3hpZJYFsAHQGnWpYpVFOiBk5Hiwvd3gPgvZbag9MlJ2gqlnS2k1Rmtq40lBO7t1ha8FRojTpYbq4mwZAtQBhqwXhGL2WxwPWSod4iVDrO%2B79esBcnNK2GAGCg13lsDzD%2B63xOzAU8U9aaDpLyTtOwLdIRIrZjbNnOK5LCb1ejMahyChse5W3DHz%2FUfqn%2BRSxA5GW8SkhcP8HEvjN7zW8UT9wqjiyuD7dBWUy%2BLmic%2B94Xt%2BxWPAMnz4N2d1XbS2MjeRJU5blMkIkhF%2Fojs6qMrVDXAo070Qx9PddMsZvv2tuBJC6xvCJYWzwHyu39UNWGn5OGCRq0G0SPXTttAKYVTNnIwTu21hbDa%2FYMJH0rvLW8AighrWql002yw7SvvjUmqDdzQvtONEGVnStVIw4m%2FjYfYPACCBHqvGlCe2WSj5mspcrWjbrW9W1iwYmicms%2BtzripBOA97AZcF2Cdz1KOXyfaxw1PQBh8OeVZBwayNsx6xv558rq1w4va6wkbRzuKuTBfIzyRCwtGaxLVEYOUtRWK%2B3PcxbzWB%2Bs871jDEm83PqoTQZkTE076k7Dq8hICZE5let6GRExi7CF3fK7JDT8vR6PazfaW8bCOMtsNLF775tDOHY9mpp3%2FGslBWCeh9wA1spL%2Fo%3D) 如何配置 babel将代码转为es5 2. 有没有其他playground 能查看转换后的结果 =================== https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240915/7986d73c3e71af347fb1b98de2cb6166.png

浏览量192

云端小仙女

Vite打包组件库后空值合并运算符？？导致编译报错，如何解决？

使用vite打包组件库，打包出来的代码含有空值合并运算符？？，导致安装的项目编译报错。实在是不知道哪里配错了，救救孩子吧～～vite.config.js配置如下。babel有升级到7。。。。 import { defineConfig } from "vite"; import react from "@vitejs/plugin-react"; import { libInjectCss } from "vite-plugin-lib-inject-css"; import babel from "@rollup/plugin-babel"; import vitePluginImp from "vite-plugin-imp"; export default defineConfig({ esbuild: { loader: "jsx", }, optimizeDeps: { esbuildOptions: { loader: { ".js": "jsx", }, }, }, plugins: [ react(), babel({ babelHelpers: "bundled", exclude: /node_modules/, plugins: ["@babel/plugin-transform-nullish-coalescing-operator"], presets: [ [ "@babel/preset-env", { targets: "> 0.25%, not dead", }, ], "@babel/preset-react", ], }), libInjectCss(), ], build: { outDir: "dist/umd", lib: { formats: ["umd"], entry: "lib/main.js", name: "DadaMobileUi", fileName: (format) => `dada-mobile-ui.${format}.js`, }, rollupOptions: { external: [ "react", "react-dom", "react/jsx-runtime", "prop-types", "@nutui/nutui-react", ], output: { globals: { react: "React", "react-dom": "ReactDOM", "react/jsx-runtime": "ReactJsxRuntime", "prop-types": "PropTypes", "@nutui/nutui-react": "nutuiReact", }, }, }, }, css: { plugins: [ require("autoprefixer")({ overrideBrowserslist: [ "> 0.5%", "last 2 versions", "ie > 11", "iOS >= 10", "Android >= 5", ], }), ], }, }); 实在是不知道哪里配错了，救救孩子吧

浏览量147

sssssjkl

有什么工具能把 js 字符串的链式访问符转换成 es5 形式?

有什么工具能把 js "字符串的链式访问符" 转换成 es5 形式? 我有个在线编辑工具,当我写 "const name = data?.name " 就报错我如何把这个字符串转换成 "const name = data && data.name" 这种形式? 大致看到了 babel 的网站 "https://babeljs.io/docs/usage" (https://link.segmentfault.com/?enc=70dCpNOTn18LVuIX4eVxkA%3D%3D.vbQ5J5D%2BJP0uernoa4yyYdMo%2FpWZPKSAYrtAgSj56G8%3D) 但是没有找到具体的使用 api... 给它一个字符串帮我转换成我想要的,还是说需要依赖 node 环境?

浏览量136

猫界袁隆平

index.html中模块引入包含jsx语法的组件, 这种组件Babel能转译吗?

"demo" (https://link.segmentfault.com/?enc=WYFU%2FxOLZt0g4TpEDkdaUQ%3D%3D.2XaCQYFdegfqud7NT5tL3XpO%2BIzu7gfCsTqYFzXhns2A7zYlU4rO7Efy1AdwLiuePbYud5qa3X%2FMpRLR3MmJF7eqSQB691yI9OXYhciBY0mdQT1rEG2cLzwxvEAlxL8ThtpgmitUE9o8BatIWPGjcEyC3v%2B5J6zEdf4mMoNNwLRVADb7PMyiUHOIFxhYotDarCWcZB58wCYkllVeXtjSIr9OZDahVQ6n32C%2ByYTerizbbpw4j%2F6oiK%2BGfafR43SCmEippNApaWO4Ttcc1cTjhMNXaBp2WlkpT9c7dRsnr3YUsWqG%2Fp35XZYSVM0otxuVLUSl99EC0LQjJdH7GY3Ecdjh5YtqTktDQ6nyGV7QTLmJyPQUto%2F%2B0b7fyLcv05qMXykFru1zUKfSRC%2Bt6nH%2Fbn16Hu1%2Fne%2Fkco0pRxLRVgu606vPnbMndAPXrU11WODflSp41xob9wa73A%2B6BKkyZNVv5UW00iDFeifMkRFnSoQFKbFT7ZRSzhVkzaGxKdizOjwk%2FjqkfIuMLiTWkToCOVXicqU9pjr96YGZ58196JnRqdFJv3hSGl7X2UsVS1efksGFJWD0inD%2F3wJq1SJaGNtf5G7aulDz6zjMl8YoDs2Wf2h5kaTc8oFe8Zfo7JhHnMDl8hSRoeEYWTwti9C7UJHOwfQu31MwXNxZUKFHYCMxogc073ISTzakWNsKyO8UoHWcH%2FM0sbOMxsAb%2FKN1W4cRklWbJANJXZzUDjSHIlOIFvlSVJacXiY7tOI4btz6xoFAcdEIW4tpNM7BIEg138egkdMSBhWIxO1yCsDzzeaNPy7I1wz4CKU6xhl7R1uSJxc2aXp7mQ7n0A%2BGzg6kQIOQeOlaMRfIT0d04YHvqjc6GbwJgU7zcDEK%2BxZpA8h%2Fq%2BUJ4QY6YuY%2BphWmB4qyAfU40oCdq9a1l6BNigKFARuPb7bQzef6aHZlmunxH0veh2PjvIpLNXh%2BAtQV3zP4YdXEi9tEwOFsoz9CelEJFoT4C5DjzGh5IgSziyF9A%2BshJ6jY5sOJnc60%2BQr86o0OublA3PknGbgRhKgUItaJ7mkhEfBz5CCf2CKFCK0jT9F5xkvr41ysjvh%2FtI9nuuMvYrtfmWgWklU%2BBlZf8PuaQOb3mTtYlaS%2BcBUSrsnBSIF1ulXC%2Bb2YmKSbcstizoko7KJs638IRwGGm8LgZrqXmWDVpd1OtAijhe89cjMvij%2FNcbO0qw4NdN%2Ft30L4i7k879IVD10PfPxhYDFlTmeJcNc%2BhmzYZJZlSllLSvlNH8M78CjO34DGlH7qs8%2FGa750CBCqmjuWZmmhEoO%2F3SFVmrTBdZkiTs7DDSVRgSbXzfeWSKvFkzRcijDoa3oOb57KekAfnm3SYuW52BMWfn2Rpa7vOkgbbDUD9Tglc2BijcbRqEqeCu%2Ft3QLzvb1gqKjo%2FcOP5BiSD2akdAaBcrDk4ptMMUoNsom9kLz8Gywhkyc79Orl5OktAruqTKH9WkOu04v6q1RPPni7QbA4%2Fz5iol4t%2FEdRrIefK9CBP85Gz5HkGPoDZ44l3nlqdGQIoKNYwsydn99vw5Ou7eRKH3QlYnq0NMN0muESIQ4T4oSZ4zV3XsOsKTSL6fIwiXYIu5sbMYkwxQihAzu%2Bqe8%2BZKzK3SY3w1VyQCNSLDUUXT1CDWi7ZmqZw4fvExRVa8rQtt3Wn5IoS%2Bzce%2Ft2Yt6z7BcP7hi7yhbYgn7%2FFySuseuPmk2KkCvAFRUgO0XTZyE%2F95OcjVTkrqs5lOQo3%2FAuNNS7z4%2Fl95HMdbusqS9kIweoNKfBlYudHXRfylfnhYou2EpAswH2JLPnLnivCZkVYF4eMBCkFgXiwW1uOuFo%2BtOdF%2FlTH9iAq%2BEOVRev3hR%2BHDz%2BPmTrcyUsxaSV0RtyoMlGT22xYC6paB1NlkFSlH60BWNq3gP7pBuKUesvLtxyuwldK1SM%2BkGfiHRGsyEWh7s8gLSI6Ollp2hEmBEw8j7EeUt1e5RqN1nz%2BcrVT%2F5MtUUf2DW5QR%2BF30jeglBzZxfXra%2FomJRsthn2uBNQoKURE5tRgr3EbRBaaJW90ce%2BKgjDwLtp3fphJRym3T0AD%2FrbMLw0P9g8K6zFfUDgYzRCa7ZAze8FdIU1a%2FMRWrRlCG7c2Mqz2rbj0xov%2BS6AtGol81RijbFKNESQuHcjnd%2BnVt%2FUn0N6S4cA8CED7aHdyaiUFAoHlGiAOMvqxVrRZbdpsMZQA%2FUIptT1w89ORAgSbUFF3R8tKpzv1hbStOG4KqC3sGkkUaehnuMRFFW1PEPbS%2FOR5cf6Soaj47Vx0VQ7PZYAW9v%2FsUKJoDiyX%2FGGW0b6lX4pO40eeitwINh6eNaLnBQwwwBv3dmndR3o%2BNrdNYyE4Y7xGxQwF2FvupzDWjCM866xFpBndwnkCiCH9czKfl%2BUrSk%2FI86N6WMeVv8adq3dAwkqaIoQVCJML5OfRrWALTn30Cj4cEGwTGDaOZWc6vTfp%2B82Szvk%2FgeMGEZVY8zHdK4o%2B6jkXF4pzmf0Zndcax5cFlbV6264TpuRGKrGhHYSmIH1hg5omnMhOIvpHZS7UKf%2BVAP3OeFsGO8jzPdLnQX7ojXjvRFPT82HO5gvuA8gj9t8B5c0ddwySdFXG3qHdL%2F6UMEiBE5%2FWGXebDY0X6ZWkQ7g9Wpu3jNDBElKirVV3kj%2FtrAXnqZHu2X6rlgWSdrxL5x7l%2Fg6AdJkoUj6nuaf1otjuBKcJtGk6BD9TtwYwnHtpRUBXYGB1Km6pE7D2Fhpec1M87kshyUVztaPjvfsog6ZDa2mcCWdeDBqIjWlwLC%2FtKsrCZdQ6XW8h3Nyk6l%2ByjIw5Bm%2BpnZ6%2BzIPKAMW6N2bbF6qe8iw9pktJNzPCgvqTmfpZTWotI3PEF9J%2BJzzgerUoPhNsyQTofoXrrq5qTQnOJ75HL3amJ3tmF%2FqEPW%2FDkQYS2yNHS39R1VyS9IvZqiF2OAHG3ij%2BMp7PFJQFT1%2FdWTAqe4I5oeVZ%2FAvXzQghg7ka11r7AGzbZriEe76Iass0bRstz30JyH4YLtSVLBXPrsXxVMeHYXGkSVbhD1%2FMZ%2BON92lisGuEn75KOmhb0eiIg8GlAvuGMuzNxOoMMtQaRC8jOjTzz8TVXGEoRY%2B6rxB1RTI%2FB7Oe6gPw0Cu%2BNpuDN5GS4OYOEudbLEFSedNlC%2FHNm67MLOXjQCMkK8PJ9Vw2uAB3TFj6CdChqO7K27VbA3X6Mjk7TewwhmLeOt9Re6J%2BapAwlMQ2m%2F7gFKHCueKJu1%2ByNABRUYpLfJ4tJF1GF4L4zUipfgHAo2NWLhu%2BRU4PpYUg%2BuqWrQHW5Z8wSrxH08q7RMCWyMVziVzBPAyzAaFT4Qy1jnWl2cX6Yby1apAFLyZLA1QTzjqN3rTZp77jLtQ%2BmHz9sH4FOxwSouym2j1iL3UT%2FYxHd%2FehYAvoaPYRqXCLQCVZvdau8xN90DvqLeHDhCRC8SbY8xtJ9FzmktoUvbVpt0CmUuG5AlIFVhtVpc1yXF4CmOTRV1gGCpG8D5f0w5%2BvG%2FwRJ7vctG4etJqpCs876WHf61bLTJgskLW0TMVA6F3b0qYD5GiWss%2BkpbtvRDjJHkFHQby3hU8fqvjbGmo5uo%2FCuGpCifyHowEn3xLBiGyXO9b%2FHx8hpqWu6vpOntcwnQmEHeMcR3PXKe1zM4axM9SPFj8Oi7%2BEKnGQuTzPsziiMhqex%2FCo42qUTse%2BgGFZx6ISggxsVYP6ar5tS4b6ce97VSZ3Lkjp6abQ4%2BRf4%2FL3MuXR5AsDZsDiKz7lUMZWLR%2BVmjGEgyyYYb9i5XSZXal8zsHo0zgfGIlY5tI9h81VgUapnCb7K3sxWTUBvgrJV4FxMqLDZQop60j3V371sbeFPOd2UdjLIPffHycWv%2BfWOfcB4uBheK2XOpoDyyPKx1cNbRf00vh6T0sNlI5ANJeuQtGFh03NWd4hhlW9rJafRHEx8piz0Oh7RIQ4b9vaK%2Bstkri%2Btx7JHUEquJFd%2FERDiKwYQD0y63AHI7MspzFlWarF%2FhYIdbL4Fq71kY4sK4N2aZR8C1EY%2B6EfyOarnzFcw96YBC2ssg5LDnXVaN0rd4sE0NridvQJDDnzZsCzNQrz17LkGvZqZITpIR6W7YL03e%2Bl54AOtRo7UMC0CAhakvGvsUSMaBIn63vcO4QI%2BjS8cUmwuDa4Esn2ko6UGDSjA%3D%3D) "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240915/aadbbd7d13593e5e0012184301d6c1d2.png) "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240915/c59bca0f8572647bee3bb5fe4d0fa4b3.png) "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240915/f6859887e8ca1d4b9702d3cb8d862134.png) 上面 DemoCom.js中用到了jsx语法, 然后index.html中以模块方式引入, 这个时候控制台报错. "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240915/f8eb85360165e274aaed64ab8e011600.png) 好像是无法解析 DemoCom中的jsx语法. 问题: 在不引入模块打包工具和手动转译的情况下有什么解决方案吗

浏览量144

金刚老六

SyntaxError Support for the experimental syntax 'optionalChainingAssign' isn't currently enabled?

webapck 启动报错 "SyntaxError: Support for the experimental syntax 'optionalChainingAssign' isn't currently enabled (103:13):" 已经引入了"@babel/plugin-proposal-optional-chaining" 还是报错，这种怎么修改？ "image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/b95ca0cce8a1dc5a29cff2945c3cfae7.png) 报错代码 common.js 在主入口文件中引入了 function scrollToCompatibleIE(element, top, left) { if (element && top && left) { if (typeof element.scrollTo !== 'function') { element?.scrollTop = top; // 这里报错 element?.scrollLeft = left; // 这里报错 } else { element?.scrollTo({ top: top, left: left, }); } } } .babelrc 配置 { "presets": [ [ "@babel/preset-env", { "targets": { "browsers": [ "ie >=9", "chrome >= 48", "android >= 4.4", "ios >= 9", "safari >= 7" ] }, "useBuiltIns": "usage", "corejs": 3 } ] ], "plugins": [ "@babel/plugin-proposal-optional-chaining", "@babel/plugin-transform-runtime" ] } webapck.config.js 配置 rules: [ { test: /\.m?js$/, // 匹配 .js 或 .mjs 文件 exclude: /node_modules/, use: { loader: "babel-loader", options: { configFile: path.resolve(__dirname, '.babelrc') // 指定Babel配置文件 } }, }, package.json 配置 { "scripts": { "start:test": "npx cross-env envMode=test webpack serve --open --mode development" }, "devDependencies": { "@babel/core": "^7.24.4", "@babel/plugin-proposal-optional-chaining": "^7.21.0", "@babel/plugin-transform-runtime": "^7.24.3", "@babel/preset-env": "^7.24.4", "@vue/compiler-sfc": "^3.4.25", "autoprefixer": "^10.4.19", "babel-loader": "^9.1.3", "clean-webpack-plugin": "^4.0.0", "css-loader": "^7.1.1", "dotenv": "^16.4.5", "html-webpack-plugin": "^5.6.0", "image-minimizer-webpack-plugin": "^4.0.0", "imagemin": "^8.0.1", "mini-css-extract-plugin": "^2.9.0", "postcss": "^8.4.38", "postcss-loader": "^8.1.1", "postcss-px-to-viewport": "^1.1.1", "sass": "^1.75.0", "sass-loader": "^14.2.1", "style-loader": "^4.0.0", "vue-loader": "^17.3.1", "webpack": "^5.91.0", "webpack-bundle-analyzer": "^4.10.2", "webpack-cli": "^5.1.4", "webpack-dev-server": "^5.0.4" }, "dependencies": { "axios": "^1.4.0", "core-js": "^3.37.0", "default-passive-events": "^2.0.0", "jquery": "^3.7.1", "regenerator-runtime": "^0.14.1", "vconsole": "^3.15.1", "vue": "^3.4.25", "weixin-js-sdk": "^1.6.5" } }

浏览量118

只想躺平

babel 需要怎么处理才能自动引入polyfill?

bebel.config.js中配置: module.exports = { presets: [ ['@babel/preset-env', { targets: { chrome: '58', firefox: '60', ie: '11', }, useBuiltIns: 'usage', corejs: 3, }], ], }; 已安装core-js useBuiltIns: 'usage', babel文档或者网上搜到，配置这个东西，可以自动引入polyfill，但是我在编译之后，并没有自动引入，需要怎么处理才能自动引入polyfill

浏览量15