কনফিগারেশন.মডিউলটির একটি অজানা সম্পত্তি 'লোডার' রয়েছে

Question

আমার ত্রুটি আউটপুট:

অবৈধ কনফিগারেশন অবজেক্ট। ওয়েবপ্যাকটি এমন একটি কনফিগারেশন অবজেক্ট ব্যবহার করে সূচনা করা হয়েছে যা API স্কিমার সাথে মেলে না। - কনফিগারেশন.মডিউলটির একটি অজানা সম্পত্তি 'লোডার' রয়েছে। এই বৈশিষ্ট্য বৈধ নয়: অবজেক্ট {exprContextCritical ?, exprContextRecursive ?, exprContextRegExp ?, exprContextRequest ?, noParse ?, নিয়ম ?, defaultRules ?, unknownContextCritical ?, unknownContextRecursive ?, unknownContextRegExp ?, unknownContextRequest ?, unsafeCache ?, wrappedContextCritical ?, wrappedContextRecursive ?, wrappedContextRegExp ?, কড়া এক্সপোর্টপ্রেজেন্স ?, কড়াটি এই কনটেক্সটঅন ইম্পোর্টস? } -> বিকল্পগুলি সাধারণ মডিউলগুলিকে প্রভাবিত করে ( NormalModuleFactory)।

আমার ওয়েবপ্যাক.কমফিগ.জেএস:

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'src/client/public');
var APP_DIR = path.resolve(__dirname, 'src/client/app');

var config = {
  entry: APP_DIR + '/index.jsx',
  module : {
    loaders : [
      {
        test : /\.jsx?/,
        include : APP_DIR,
        loader : 'babel-loader'
      }
    ]
  },
  output: {
    path: BUILD_DIR,
    filename: 'bundle.js'
  }

};


module.exports = config;

আমার ওয়েবপ্যাক সংস্করণ:

webpack@4.1.1

Answer 1

আপনার ওয়েবপ্যাক 4 এ পরিবর্তন loadersকরা উচিত rules:

পরিবর্তন:

loaders 

প্রতি:

rules

উত্স: লোডার

উদাহরণ:

module.exports = {
  module: {
    rules: [
      { test: /\.css$/, use: 'css-loader' },
      { test: /\.ts$/, use: 'ts-loader' }
    ]
  }
};

Comments

এটা কি টাইপো? এটি rulesওয়েবপ্যাক 4 এ হওয়া উচিত

— পাপ করুন

আপনি webpack 4. নিয়ম ব্যবহার করা উচিত

— S.M_Emamian

ওয়েবপ্যাক 4-এ নিয়মগুলিতে লোডারগুলি পরিবর্তন করুন ... যদি এটি আবার বলা দরকার: /

— হেলমুট গ্রান্ডা

আপনার উত্তরে আপনার ব্যাখ্যা করা উচিত যে পরিবর্তনের কারণটি ওয়েবপ্যাক ৪

— কোজো

Answer 2

rulesপরিবর্তে ওয়েবপ্যাক 4 এ ব্যবহার করুন loaders।

https://webpack.js.org/concepts/loaders/

Answer 3

উপরে দেওয়া উত্তরগুলি কাজ করছে তবে আমরা ওয়েবপ্যাক এবং ওয়েবপ্যাক-ডেভ-সার্ভার সংস্করণে পরিবর্তন করে এই সমস্যাটি সমাধান করতে পারি

"webpack": "3.8.1",
"webpack-dev-server": "2.9.4"

এটিও সমস্যার সমাধান করতে পারে। আশা করি এটি সাহায্য করবে।

Comments

তোমাকে একটা আপটিক দিয়েছি। কেবল সমস্যাটি হ'ল লোকেরা নতুন বৈশিষ্ট্যগুলি পেতে ফ্রেমওয়ার্ক এবং সরঞ্জামগুলির সংস্করণ আপ করতে চায় কেবল তাদের কনফিগারেশন ফাইলগুলি পরিবর্তন করতে হবে না তা নিশ্চিত করার জন্য পুরানো সংস্করণগুলিতে ফিরে যেতে না পারে। কনফিগার ফাইলটি পরিবর্তনের জন্য যন্ত্রটি গ্রহণ করা নতুন উপায়ে কাজ করে এমনটি খারাপ নয়। অসম্ভব না হলে।

— এনিওলা

ধন্যবাদ @ এনিওলা, হ্যাঁ আপনি ঠিক বলেছেন। আমি যেমন উল্লেখ করেছি S.M_Emamian উত্তর সঠিক তবে আমার উত্তরটি কাজ করবে যদি কেউ কাজ করতে রাজি হয় তবে ওয়েবপ্যাকের পুরানো সংস্করণ হবে।

— আনশুল

Answer 4

আপনার ওয়েবপ্যাক কনফিগারেশন ফাইলগুলি স্থানান্তরিত করার জন্য আপনার স্থানান্তর ইউটিলিটিটি ব্যবহার করা উচিত , এটি আমার পক্ষে কাজ করেছে।

মাইগ্রেশন ডকুমেন্টেশন এছাড়াও দরকারী।

Answer 5

ওয়েবপ্যাক.কমফিগ.জেএস এর নিচে আমার জন্য কাজ করা

module.exports = {
    entry: [
        '.src/index.js'
    ],
    output:{
        path: __dirname,
        filename: 'app/js/main.js'
    },
    module:{
        rules: [
          { test: /\.css$/, use: 'css-loader' },
          { test: /\.ts$/, use: 'ts-loader' }
        ]
    }
}