Ön ayar dosyalarının nesneleri dışa aktarmasına izin verilmez

91

Almak index.jsve oluşturmak istediğim bir atlıkarınca dosyam var block.build.js, bu yüzden benim webpack.config.js:

var config = {
  entry: './index.js',
  output: {
    path: __dirname,
    filename: 'block.build.js',
  },
  devServer: {
    contentBase: './Carousel'
  },
  module : {
    rules : [
      {
        test: /.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
          presets: ['react', 'es2015'],
          plugins: ['transform-class-properties']
        }
      }
    ]
  }
};
module.exports = config;

Kullandığım package.jsonşey aşağıdadır:

{
  "name": "carousel",
  "version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "dependencies": {
    "@babel/core": "^7.0.0-beta.40",
    "babel-cli": "^6.26.0",
    "babel-loader": "^8.0.0-beta.0",
    "babel-plugin-lodash": "^3.3.2",
    "babel-plugin-react-transform": "^3.0.0",
    "babel-preset-react": "^6.24.1",
    "cross-env": "^5.1.3",
    "lodash": "^4.17.5",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-swipeable": "^4.2.0",
    "styled-components": "^3.2.1"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "watch": "webpack --watch",
    "start": "webpack-dev-server --open",
    "build": "webpack"
  },
  "devDependencies": {
    "webpack": "^4.1.1",
    "webpack-cli": "^2.0.10",
    "webpack-dev-server": "^3.1.0"
  },
  "author": "brad traversy",
  "license": "ISC"
}

… Ama şu hata mesajını alıyorum:

ERROR in ./index.js
Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functions.

Bunun nasıl çözüleceğini bilen biri var mı?

reactjs  webpack  babeljs 
— sonia maklouf
kaynak
valentinog.com/blog/babel bana yardımcı oldu.
— Ryan

Yanıtlar:

89

Babel 6 ve Babel 7'nin bir kombinasyonunu kullanıyorsunuz. Sürümler arasında uyumluluk garantisi yoktur:

"@babel/core": "^7.0.0-beta.40",
"babel-cli": "^6.26.0",
"babel-loader": "^8.0.0-beta.0",
"babel-plugin-lodash": "^3.3.2",
"babel-plugin-react-transform": "^3.0.0",
"babel-preset-react": "^6.24.1",

olmalı

"@babel/core": "^7.0.0-beta.40",
"@babel/cli": "^7.0.0-beta.40",
"babel-loader": "^8.0.0-beta.0",
"babel-plugin-lodash": "^3.3.2",
"babel-plugin-react-transform": "^3.0.0",
"@babel/preset-react": "^7.0.0-beta.40",

ve

    query: {
      presets: ['react', 'es2015'],
      plugins: ['transform-class-properties']
    }

olabilir

    query: {
      presets: ['@babel/react', '@babel/es2015'],
      plugins: ['@babel/proposal-class-properties']
    }

Ben de söz etmedi çünkü karıştı @babel/proposal-class-propertiesGözlerinde farklı package.json, ama aynı zamanda orada güncellenmelidir o olduğunu varsayarak.

— loganfsmyth
kaynak
1
babel-loader8'in diğer modüller v7 ile kullanılması gerektiğini vurgulamak isterdim ve kullanmak npm install --save-dev babel-loader@^7bana başka hatalar verdi
— YakovL
o zaman sadece babel 6 veya 7'ye ait olan paketler nasıl sağlanır? Tüm çözümleri inceledim ve sonra bana @ babel / core veya babel-core sordu. Paket manuel olarak değiştirilebilir mi?
— Carmine Tambascia
o zaman sadece babel 6 veya 7'ye ait bir paketten nasıl emin olunur? Tüm çözümleri inceledim ve sonra bana @ babel / core veya babel-core sordu. Önbellek sorunu için hala bir şekilde yanlış babel'e başvuran düğüm modülleri ile ilgisi olduğuna inanıyorum. Ben de şanssız bir şekilde manuel olarak değiştirmeyi denedim
— Carmine Tambascia
Bu durum hala devam ediyor. Şimdiye kadar bu araç github.com/babel/babel-upgrade , yükseltilecek daha fazla bağımlılığın sunulduğu bir yol gibi görünüyor
— Carmine Tambascia
Hala bu hatayla ilgili sorunlar yaşıyorum, biri bana yardımcı olabilir mi? React uygulamamı (webpack kullanır) bir ekspres sunucuda çalıştırmaya çalışıyorum. İşte benim github depom ( github.com/smthmelv/my-react-app/tree/addExpressJS ), herhangi bir yardım çok takdir edilecektir.
— Darneezie
42

Başıma geldi ve benim için basit bir çözüm kaldırmaktı babel-loader@8^ve @babel/core:

npm uninstall --save babel-loader
npm uninstall --save @babel/core

… Ve sonra sürüm 7 babel yükleyiciyi yüklemek için:

npm install --save-dev babel-loader@^7
— Kevin Youn
kaynak
1
Gerçekten işe yaradı, bu bilgi için çok teşekkürler. Ayrıca babel / core sürüm 7 ve babel-loader sürüm 8'i kullanıyordum. Bu yüzden sadece sürüm 8'i kaldırdım ve sürüm 7'yi komutla npm install --save-dev babel-loader@^7
— yükledim
1
Başka bir js çerçevem ​​kurulu olmasa da bu benim için düzeltti.
— Nathaniel Flick
1
Temelde bir öğleden sonrayı boşa harcıyorum çünkü birkaç hafta önce doğru webpack 2'yi ilk kurduğumdan beri pek çok paket değişiyor. Kararlı paketleri takip etmenin bir yolu var mı? Bu hiç üretken değil. Babel paketlerini yüklemeye devam etmeyen react bileşenini geliştirmek istiyorum
— Carmine Tambascia
1
Bu benim için işe yarıyor, ancak Modül oluşturma başarısız olan başka bir hata aldım (./node_modules/babel-loader/lib/index.js'den): bu yüzden çözmek için sabırsızlanıyorum
— Francis Tito
1
Pek çok açık kaynak projesi oldukça güncel olmadığı için bu sorunu yaşamaya devam ettiğim için inanılmaz ama babel 6'ya veya babel 7 ile bir karışımına bakın
— Carmine Tambascia
11

Ayrıca babel-loaderv8'den biraz değiştiler:

web paketi 4.x | babel yükleyici 8.x | babel 7.x

npm install -D babel-loader @babel/core @babel/preset-env webpack

web paketi 4.x | babel yükleyici 7.x | babel 6.x

npm install -D babel-loader@7 babel-core babel-preset-env webpack

( @babel/preset-reactyerine aynı şey babel-preset-react).

— Thomas Decaux
kaynak
8

Web paketimde / react projemde aynı sorunu yaşadım - .babelrcdosyayla ilgili bir sorun var gibi görünüyor .

Aşağıda görüldüğü gibi güncelledim ve hile yaptı:

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ],
    "plugins": [
        "transform-class-properties",
        "transform-object-rest-spread"
    ]
}
— Rawan-25
kaynak
3

bu benim için çalıştı:

npm uninstall --save babel-loader
npm uninstall --save @babel/core
npm install --save-dev babel-loader@^7

ve babelrc'de:

"presets" : ["es2015", "react"]
— Anilal
kaynak
Bu sorunu çözmek için en azından bazı gizli bağımlılıkların hala önceki sürümü "gerektirdiğini" önleyen köprü paketini kurmayı hatırlamak için bu tamam değil, bu npm kurulumu sayesinde bu hatayı 1 saatten fazla bir süre sonra çözdüm --save -dev "babel-core@🖤7.0.0-bridge.0" buradan github.com/babel/babel/issues/8482
— Carmine Tambascia
3

Bu çözüm benim için çalıştı:

npm install babel-loader babel-preset-react

daha sonra .babelrc

{
  "presets": [
    "@babel/preset-env", "@babel/preset-react"
  ]
}

daha sonra çalıştırın npm run start, webpack distdizini oluşturacaktır .

— Ramy M. Mousa
kaynak
3

Babel 7'de sürüm 6'dan yükseltmeler var, https://babeljs.io/docs/en/v7-migration adresine bakın . Mevcut problemi / hatayı çözmek için

Yüklemek

npm install --save-dev @babel/preset-react

npm install --save-dev @babel/preset-env

sonra .babelrc'de hazır ayarlar için bağımlılık şöyle görünmelidir

{

"presets":["@babel/preset-env", "@babel/preset-react"],

   "plugins": [
    "react-hot-loader/babel", "transform-object-rest-spread"]

}
— Jonatan
kaynak
1

.Babelrc'deki ön ayarlarımda "stage-1" vardı, bu yüzden onu kaldırdım ve hata ortadan kalktı

— Sam
kaynak
1

Bunun nedeni eski babel paketlerinin kullanılmasıdır. Babel projesi, diğer aktif Javascript projelerinin çoğu gibi, kapsam paketlerini kullanmaya devam etti. Dolayısıyla, paket adları@babel

İplik kullanıyorsanız, aşağıdakileri izleyin:

1. Adım: Eski paketleri kaldırın

$ yarn remove babel-core babel-loader babel-preset-env babel-preset-react

Adım 2: Yeni paketleri ekleyin

$ yarn add -D @babel/core babel-loader @babel/preset-env @babel/preset-react

Npm kullanıyorsanız, aşağıdakini izleyin:

1. adım: Eski paketleri kaldırın

$ npm uninstall babel-core babel-loader babel-preset-env babel-preset-react

Adım 2: Yeni paketleri ekleyin

$ npm add -D @babel/core babel-loader @babel/preset-env @babel/preset-react

Adım 3: Hem npm hem de iplik için ortak

Yeni paketleri yükledikten sonra, güncelleştirmeyi unutmayın .babelrcdan ön ayarları reactiçin @babel/preset-react. İşte basit bir örnek

{
"presets": [
"@babel/preset-env",
"@babel/preset-react"
]
}
— Anand Raja
kaynak
0

.Babelrc dosyanızı aşağıdaki kodu değiştirin, bu benim sorunumu düzeltin

{
  "presets": ["module:metro-react-native-babel-preset"]
}
— Rajesh Nasit
kaynak
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.