在打字稿反应项目中使用ant.d / babel-loader

时间:2018-07-02 12:52:33

标签: reactjs webpack babeljs

我想在我的打字稿webpack项目中使用babel-loader。现在,这是我的装载机当前的样子:

....
    rules: [
      {
        test: /\.tsx?$/,
        use: {
         loader: 'ts-loader',
          options: {
           transpileOnly: true,
           happyPackMode: true
          }
        },
        {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env'],
            plugins: [["import", {
              "libraryName": "antd",
              "style": true,   // or 'css'
            }]]
          }
        },
        include: [utils.root('./src/main/webapp/app')],
        exclude: ['node_modules']
      },
      ....
    ]
    ....

babel + webpack发生了很多黑魔法,我不确定如何将它们正确地配置在一起。这是以前的加载程序设置出现的错误:

ERROR in ./src/main/webapp/app/index.tsx
Module build failed (from ./node_modules/thread-loader/dist/cjs.js):
Thread Loader (Worker 0)
.presets[0][1] must be an object, false, or undefined

    at assertPluginItem (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/validation/option-assertions.js:181:15)
    at arr.forEach (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/validation/option-assertions.js:159:30)
    at Array.forEach (<anonymous>)
    at assertPluginList (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/validation/option-assertions.js:159:9)
    at Object.keys.forEach.key (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/validation/options.js:99:20)
    at Array.forEach (<anonymous>)
    at validate (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/validation/options.js:69:21)
    at file (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/config-chain.js:158:34)
    at cachedFunction (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/caching.js:32:19)
    at buildRootChain (/Users/andrewcarre/Desktop/FamilyHomestay-0Auth/FamilyHomestay/node_modules/@babel/core/lib/config/config-chain.js:114:36)
 @ multi (webpack)-dev-server/client?http://localhost:9060 webpack/hot/dev-server react-hot-loader/patch ./src/main/webapp/app/index

有什么想法吗?

编辑-------

我找到了这个图书馆。它完成了babel-loader对打字稿所做的所有工作。 https://github.com/Brooooooklyn/ts-import-plugin

0 个答案:

没有答案