将 git repo 作为包安装在另一个项目中

Question

我正在尝试将 git 存储库安装到项目中，以便可以导入组件。我无法使用 npm 来打包组件，因为我们没有私有的 npm 注册表。

当我尝试安装时，我收到“当前未启用对实验性语法‘jsx’的支持”。我已经尝试了这里的所有解决方案：当前未启用对实验性语法“classProperties”的支持但它们没有起作用。 这是我的 .babelrc :

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ],
    "plugins": [
        [
          "@babel/plugin-proposal-class-properties"
        ]
    ]
  }

还有package.json：

  "name": "i-react",
  "version": "1.0.0",
  "main": "build/index.js",
  "repository": "ssh://......,
  "author": "",
  "license": "MIT",
  "scripts": {
    "build": "babel src -d build",
    "prepare": "yarn run build"
  },
  "devDependencies": {
    "@babel/cli": "^7.10.5",
    "@babel/core": "^7.11.4",
    "@babel/plugin-proposal-class-properties": "^7.10.4",
    "@babel/plugin-syntax-jsx": "^7.10.4",
    "@babel/preset-env": "^7.11.0",
    "@babel/preset-react": "^7.10.4"
  },
  "dependencies": {
    "react": "^16.13.1"
  }
}

Answer 1

向上，对我来说同样的问题。

webpack.config.js :

// Generated using webpack-cli https://github.com/webpack/webpack-cli

const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");

const isProduction = process.env.NODE_ENV == "production";

const config = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "dist"),
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "index.html",
    }),

    // Add your plugins here
    // Learn more about plugins from https://webpack.js.org/configuration/plugins/
  ],
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/i,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            plugins: ["@babel/plugin-syntax-jsx"],
            presets: [
              '@babel/preset-env',
              '@babel/preset-react',
            ],
          },
        },
      },
      {
        test: /\.(eot|svg|ttf|woff|woff2|png|jpg|gif)$/i,
        type: "asset",
      },
      {
        test: /\.(ts|tsx)$/,
        use: 'ts-loader',
      },
      // Add your rules for custom modules here
      // Learn more about loaders from https://webpack.js.org/loaders/
    ],
  },
};

module.exports = () => {
  if (isProduction) {
    config.mode = "production";
  } else {
    config.mode = "development";
  }
  return config;
};

.babelrc:

{
  "plugins": ["@babel/syntax-dynamic-import"],
  "presets": [
      "@babel/preset-env",
    "@babel/preset-react"
  ]
}