使用可加载组件创建站点地图时出现问题create-react-app

时间:2019-09-26 07:28:28

标签: node.js reactjs babeljs sitemap ecma

我正在为reactjs应用创建站点地图。我为此使用了react-router-sitemap。我在babelrc中添加了所有必需的插件以遍历React组件,但每次都以相同的错误结束。

我正在使用react-loadable。我不确定我的babelrc文件是否存在问题或代码设计。 我也搜索了react-loadable / babel问题,但找不到相关的解决方案。 我正在使用react-route 4进行路由。也是基于功能的代码结构。 像下面一样

<Route exact strict path="/" component={features.login.pages.Login} />

瞥见登录页面

import Loadable from "base_components/Loadable"
import reducer, { types, selectors } from "./ducks"
import { logout } from "./thunks"
const pages = {
  Login: Loadable({
    loader: () => import("./LoginPage")
  })
}
const actions = { logout }
export { pages, reducer, selectors, types, actions }

我遇到的错误

 basic@0.1.0 sitemap /home/frontend
> node ./sitemap-builder.js

/home/frontend/node_modules/react-loadable/lib/babel.js:44
            propertiesMap[key.node.name] = property;
                                   ^

TypeError: Cannot read property 'name' of undefined
    at /home/frontend/node_modules/react-loadable/lib/babel.js:44:36
    at Array.forEach (<anonymous>)
    at /home/frontend/node_modules/react-loadable/lib/babel.js:42:22
    at Array.forEach (<anonymous>)
    at PluginPass.ImportDeclaration (/home/frontend/node_modules/react-loadable/lib/babel.js:24:32)
    at newFn (/home/frontend/node_modules/@babel/traverse/lib/visitors.js:195:21)
    at NodePath._call (/home/frontend/node_modules/@babel/traverse/lib/path/context.js:53:20)
    at NodePath.call (/home/frontend/node_modules/@babel/traverse/lib/path/context.js:40:17)
    at NodePath.visit (/home/frontend/node_modules/@babel/traverse/lib/path/context.js:88:12)
    at TraversalContext.visitQueue (/home/frontend/node_modules/@babel/traverse/lib/context.js:120:16)

我的.babelrc文件:

{
  "ignore": [
  "node_modules/**/*"
],
"presets": [
  "@babel/preset-env",
  "@babel/preset-react"
],
"plugins": [
  "@babel/plugin-transform-runtime",
  "babel-plugin-react-css-modules",
  "transform-class-properties",
  "@babel/plugin-syntax-dynamic-import",
  "transform-object-assign",
  "@babel/plugin-proposal-object-rest-spread",
  "react-loadable/babel",
  "add-module-exports",
  "@babel/plugin-proposal-class-properties",
    "syntax-async-functions",
    "transform-async-to-generator",
    "syntax-class-properties",
    "babel-plugin-styled-components",
  ["dynamic-import-node",
  { "noInterop": false }],
  ["module-resolver", {
    "cwd": "babelrc",
    "root": ["./src"]
  }]
]
}

和sitemap-builder文件:

require("@babel/register")({
  extends: "./.babelrc"
})

require.extensions[".css"] = function() {
  return null
}

const router = require("./src/routes/index").default
const Sitemap = require("react-router-sitemap").default
new Sitemap(router).build("http://localhost:3000").save("./sitemap.xml")

0 个答案:

没有答案