Django Webpack React:不允许插件/预设文件导出对象,仅导出功能

时间:2019-11-28 05:06:30

标签: django reactjs npm webpack django-rest-framework

我正在尝试配置Django的反应。

但是由于某种原因,每当我尝试npm run start时,都会出现此错误: Plugin/Preset files are not allowed to export objects, only functions. In ../../node_modules/babel-preset-react/lib/index.js 我试过了: npm install @babel/preset-react npm install babel-preset-react --save-dev npm install -D babel-loader @babel/core @babel/preset-env webpack,但是什么也没做。

Django版本:2.2.6

Webpack配置:

var path = require('path');
var webpack = require('webpack');
var BundleTracker = require('webpack-bundle-tracker');
module.exports = {
  entry:  path.join(__dirname, 'assets/src/js/index'),
  output: {
    path: path.join(__dirname, 'assets/dist'),
    filename: '[name]-[hash].js'
  },
  plugins: [
    new BundleTracker({
      path: __dirname,
      filename: 'webpack-stats.json'
    }),
  ],
  module: {
      rules: [
        {
          test: /\.jsx?$/,
          loader: 'babel-loader',
          exclude: /node_modules/,
          options: {
             presets: ['react']
          }
        },
      ],
    },
}

设置:

WEBPACK_LOADER = {
    'DEFAULT': {
        'BUNDLE_DIR_NAME': 'dist/',
        'STATS_FILE': os.path.join(BASE_DIR, 'webpack-stats.json'),
    }
}

.babelrc:

{
    "presets": [
      "es2015", "react"
    ]
}

package.json:

{
  "name": "collegeapp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "./node_modules/.bin/webpack --config webpack.config.js",
    "watch": "npm run start -- --watch"
  },
  "repository": {
    "type": "git",
    "url": 
  },
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": 
  },
  "homepage":
  "devDependencies": {
    "@babel/core": "^7.7.4",
    "@babel/preset-env": "^7.7.4",
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.6",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-register": "^6.26.0",
    "webpack": "^4.41.2",
    "webpack-bundle-tracker": "^0.4.3",
    "webpack-cli": "^3.3.10"
  },
  "dependencies": {
    "react": "^16.12.0",
    "react-dom": "^16.12.0"
  }
}

1 个答案:

答案 0 :(得分:0)

问题是您为应用程序提供了两种方式,我在配置react base时遇到了这种复杂性。

基于babel核心,您需要安装babel react及其预设。就像使用 @ babel / core 一样,安装 @ babel / react和@ babel / preset-react 。确保您的react babel插件支持Babel内核。

删除不必要的babel插件,这会使web-pack混淆使用哪个babel。

希望有帮助。