根目錄外的 webpack /src

Question

我正在嘗試指定一個不在我的 React 項目根目錄下的 webpack 入口點。 本質上，我想將我的整個/src目錄移動到其他地方，以便可以共享。 這是我的目錄結構和 webpack 配置：

monorepo/
|-- webpack-project/
|-- |-- package.json
|-- |-- webpack.config.json
|-- |-- old-src/
|-- |-- |-- index.js
|-- other-project
|-- |-- src/
|-- |-- |-- index.js

module.exports = {
    entry: {
        app: `${__dirname}/../other-project/src/index.js`
    },
    output: {
        path: path.resolve(`${__dirname}/wwwroot`),
        publicPath: '/',
        filename: '[name].js',
    },
    module: {
        rules: [
            { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
            { test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ },
        ],
    },
}

當我指定${__dirname}/old-src/index.js ，我的項目構建良好。 當我指定其他項目/src 的路徑時，它有問題。 我從 babel 加載器得到的錯誤是在入口文件中 JSX 的第一行： Support for the experimental syntax 'jsx' isn't currently enabled 。

有誰知道我正在嘗試做的事情是否可行，或者我是否應該采取不同的方法？

Answer 1

添加path作為開發依賴項並使用它：

const path = require('path');
...
app: path.join(__dirname, '../other-project/src/index.js'),

Answer 2

通過進行 2 個更改修復：

第一個主要的，我通過 .babelrc 重命名為 babel.config.js。 更多關於為什么這在這里解決了問題。

我還添加了 resolve.modules 配置來添加 webpack-project 的 node_modules。

  ...

  resolve: {
      modules: [ path.resolve(__dirname, 'node_modules') ],
  },

  ...