reactjs - Reactjs - Webpack 构建错误：错误：插件/预设文件不允许导出对象，只有函数

问题描述

我正在尝试打印项目，但无法创建webpack。我在项目中使用了 devextreme对象，我需要进行与此相关的设置吗？

Hash: 79a2ea44e6cd4deb6dd7
Version: webpack 4.29.5
Time: 1885ms
Built at: 2019-03-01 10:44:41
     Asset      Size  Chunks             Chunk Names
 bundle.js  6.62 KiB    main  [emitted]  main
index.html  1.65 KiB          [emitted]
Entrypoint main = bundle.js
[./src/index.js] 2.49 KiB {main} [built] [failed] [1 error]

ERROR in ./src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In C:\Users\takgu\Desktop\react-test\node_modules\babel-preset-stage-0\lib\index.js    at createDescriptor (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-descriptors.js:178:11)
    at items.map (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-descriptors.js:109:29)
    at createPresetDescriptors (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-descriptors.js:101:10)
    at presets (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-descriptors.js:47:19)
    at mergeChainOpts (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-chain.js:320:26)
    at C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-chain.js:283:7
    at buildRootChain (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\config-chain.js:120:22)
    at loadPrivatePartialConfig (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\partial.js:85:55)
    at Object.loadPartialConfig (C:\Users\takgu\Desktop\react-test\node_modules\@babel\core\lib\config\partial.js:110:18)
    at Object.<anonymous> (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:140:26)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:3:103)
    at _next (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:5:194)
    at C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:5:364
    at new Promise (<anonymous>)
    at Object.<anonymous> (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:5:97)
    at Object._loader (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:220:18)
    at Object.loader (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:56:18)
    at Object.<anonymous> (C:\Users\takgu\Desktop\react-test\node_modules\babel-loader\lib\index.js:51:12)
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = index.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./public/index.html] 1.85 KiB {0} [built]
    [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 475 bytes {0} [built]
    [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 546 bytes {0} [built]
        + 1 hidden module

我已经阅读并应用了与webpack 设置相关的文档，但我无法摆脱错误。我在下面分享了webpack.config.js的内容。

var path=require("path"); //dosya yolunu alabilmek için kütüphanesini ekledik.
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports={
    entry:'./src/index.js', //paketlenip tek bir dosya haline gelecek dosyayı belirtiyoruz yani en baş dosya
    output:{
        path:path.resolve(__dirname,'bundle'), // çıkacak olan dosyanın nerede çıkması gerektiğini gösteriyoruz
        filename:'bundle.js' //çıkacak dosyanın adını belirtiyoruz
    },
    mode:'development', //burada production der isek çıkan dosya okunmaz bir şekilde çıktı verir fakat development der isek okunmayacak şekilde sıkıştırarak çıktı verir
    module:{
        rules:[
            {
                test:/\.js$/,
                exclude:'/node_modules/',
                loaders:['babel-loader'],

            },
            { test: /\.css$/, use: ['style-loader', 'css-loader'] },
            { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file-loader' },
            { test: /\.(woff|woff2)$/, loader: 'url-loader?prefix=font/&limit=5000' },
            {
              test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
              loader: 'url-loader?limit=10000&mimetype=application/octet-stream'
            },
            {
              test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
              issuer: {
                test: /\.jsx?$/
              },
              use: ['babel-loader', '@svgr/webpack', 'url-loader']
            },
            {
              test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
              loader: 'url-loader'
            },
            {
              test: /\.png(\?v=\d+\.\d+\.\d+)?$/,
              loader: 'url-loader?limit=10000&mimetype=image/png'
            },
            {
              test: /\.gif(\?v=\d+\.\d+\.\d+)?$/,
              loader: 'url-loader?limit=10000&mimetype=image/gif'
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
          template: 'public/index.html'
        })
      ]
};

我在这里分享了.babelrc文件的设置

{
  "presets": ["env", "stage-0", "react","es2015"],
  "plugins": [
      "transform-decorators-legacy"
  ]
}

我在等你的帮助。

标签： reactjswebpack

reactjs - Reactjs - Webpack 构建错误：错误：插件/预设文件不允许导出对象，只有函数

问题描述

解决方案

推荐阅读