Как настроить preact-compat, чтобы сторонний код React не отображался как <undefined>? - PullRequest
Новая
       36

Как настроить preact-compat, чтобы сторонний код React не отображался как <undefined>?

0 голосов
/ 12 апреля 2019

Я хочу использовать сторонние пакеты на основе React в моем приложении preact, поэтому я не назвал preact-compat. Теперь я могу писать компоненты React, но сторонний код вообще не переносится и отображается как. Browserify или Babel пропускают сторонний код?

В файле Grunt: 

. . .
browserify: {
  options: {
    watch: true,
    transform: [['babelify', {
      presets: ['@babel/preset-env', '@babel/preset-react'],
      plugins: [
        ['module-resolver', {
          'root': ['.'],
          'alias': {
            'react': 'preact-compat',
            'react-dom': 'preact-compat'
          }
        }],
        ['babel-plugin-jsx-pragmatic', { 'module': 'preact', 'import': 'h', 'export': 'h'}],
        ['@babel/plugin-transform-react-jsx', {pragma:'h'}]
      ],
    }]],
    browserifyOptions: {
      standalone: 'Viewer', // Set name of package as window global when no package system is present
      debug: true           // Enables Source Maps
    }
  },
  all: {
    options: {
      watch: true,          // Listen for incremental changes to files (fast incremental build)
    },
    files: {
      '../server/public/XXX': ['js/index.js'],
      '../server/public/XXX': ['js/viewer/viewer.js'],
      '../server/public/tests/XXX': ['tests/**/*.js'],
    }
  }
},
. . .

В .babelrc: 

    {
  "plugins": [
    ["module-resolver", {
    "root": ["."],
    "alias": {
        "react": "preact-compat",
        "react-dom": "preact-compat"
    }
    }],
    ["babel-plugin-jsx-pragmatic", { "module": "preact", "import": "h", "export": "h" }],
    ["@babel/plugin-transform-react-jsx", { "pragma": "h" }]
  ],
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ]
}
...