maven 无法找到模块“@babel/plugin-proposal-class-properties”- React+Spring-boot

ryevplcw 于 2023-08-03 发布在 Maven

关注(0)|答案(3)|浏览(147)

我试图将ReactJS现有的项目集成到Spring-boot的项目中。我正在使用的项目已经运行良好的教程，我已经实现。
pom.xml与frontend-maven-plugin一起使用。
在我复制了我想集成的应用程序的文件之前，它工作得很好.
现在我得到了这个**错误 *：

Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '@babel/plugin-proposal-class-properties' from 'C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying'
    at Function.module.exports [as sync] (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\resolve\lib\sync.js:58:15)
    at resolveStandardizedName (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\files\plugins.js:101:31)
    at resolvePlugin (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\files\plugins.js:54:10)
    at loadPlugin (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\files\plugins.js:62:20)
    at createDescriptor (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-descriptors.js:154:9)
    at items.map (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-descriptors.js:109:50)
    at Array.map (<anonymous>)
    at createDescriptors (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-descriptors.js:109:29)
    at createPluginDescriptors (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-descriptors.js:105:10)
    at alias (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-descriptors.js:63:49)
    at cachedFunction (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\caching.js:33:19)
    at plugins.plugins (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-descriptors.js:28:77)
    at mergeChainOpts (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-chain.js:319:26)
    at C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-chain.js:283:7
    at buildRootChain (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\config-chain.js:68:29)
    at loadPrivatePartialConfig (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\partial.js:85:55)
    at Object.loadPartialConfig (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\@babel\core\lib\config\partial.js:110:18)
    at Object.<anonymous> (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:140:26)
    at Generator.next (<anonymous>)
    at asyncGeneratorStep (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:3:103)
    at _next (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:5:194)
    at C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:5:364
    at new Promise (<anonymous>)
    at Object.<anonymous> (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:5:97)
    at Object._loader (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:220:18)
    at Object.loader (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:56:18)
    at Object.<anonymous> (C:\izhar\files\eclipse-workspaces\Spring-Hibernate\HibernateStudying\node_modules\babel-loader\lib\index.js:51:12)
    at Object../src/main/resources/static/js/app.js (http://localhost:8080/built/bundle.js:96:7)
    at __webpack_require__ (http://localhost:8080/built/bundle.js:20:30)
    at http://localhost:8080/built/bundle.js:84:18
    at http://localhost:8080/built/bundle.js:87:1

字符串
我通过一些搜索尝试了一些变通方法，但没有成功。
这是pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.1.3.RELEASE</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.lingar</groupId>
    <artifactId>SocialEventsTrying1</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>SocialEventsTrying1</name>
    <description>Demo project for Spring Boot</description>

    <properties>
        <java.version>1.8</java.version>
    </properties>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-rest</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
        <!-- Use MySQL Connector-J -->

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.47</version><!-- this version  solve the time issue -->
        </dependency>

        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <optional>true</optional>
        </dependency>
    </dependencies>

    <build> 
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
            <!-- tag::frontend-maven-plugin[] -->
            <plugin>
                <groupId>com.github.eirslett</groupId>
                <artifactId>frontend-maven-plugin</artifactId>
                <version>1.6</version>
                <configuration>
                    <installDirectory>target</installDirectory>
                </configuration>
                <executions>
                    <execution>
                        <id>install node and npm</id>
                        <goals>
                            <goal>install-node-and-npm</goal>
                        </goals>
                        <configuration>
                            <nodeVersion>v10.11.0</nodeVersion>
                            <npmVersion>6.4.1</npmVersion>
                        </configuration>
                    </execution>
                    <execution>
                        <id>npm install</id>
                        <goals>
                            <goal>npm</goal>
                        </goals>
                        <configuration>
                            <arguments>install</arguments>
                        </configuration>
                    </execution>
                    <execution>
                        <id>webpack build</id>
                        <goals> 
                            <goal>webpack</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
            <!-- end::frontend-maven-plugin[] -->
        </plugins>
    </build>

</project>

型
yyy这是webpack.config.js：

var path = require('path');

module.exports = {
    entry: './src/main/resources/static/js/app.js',
    devtool: 'sourcemaps',
    cache: false,
    mode: 'development',
    output: {
        path: __dirname,
        filename: './src/main/resources/static/built/bundle.js'
    },
    module: {
        rules: [
            {
                test: path.join(__dirname, '.'),
                exclude: /(node_modules)/,
                use: [{
                    loader: 'babel-loader',
                    options: {
                        presets: ["@babel/preset-env", "@babel/preset-react"]
                    }
                }]
            }
        ]
    }
};

型
这是webpack在我尝试了一些更改之后。

var path = require('path');

module.exports = {
    entry: './src/main/resources/static/js/app.js',
    devtool: 'sourcemaps',
    cache: false,
    mode: 'development',
    output: {
        path: __dirname,
        filename: './src/main/resources/static/built/bundle.js'
    },
    module: {
        rules: [
            {
                test: path.join(__dirname, '.'),
                exclude: /(node_modules)/,
                use: [{
                    loader: 'babel-loader',
                    options: {
                        presets: ["@babel/preset-env", "@babel/preset-react"],
                        plugins : [
                                      '@babel/plugin-proposal-class-properties'
                                  ]

                    }
                }
                ]
            }
        ]
    }
};

型
什么都不管用。
在每个更改中，我都在Eclipse中进行Maven-update并重新开始项目。
我很乐意找到解决办法，谢谢。

编辑：package.json

{
  "name": "social-events-trying1",
  "version": "0.1.0",
  "description": "Trying to build the primary structure of the App + Spring Data REST",
  "repository": {
    "type": "git",
    "url": "git@github.com:spring-guides/tut-react-and-spring-data-rest.git"
  },
  "keywords": [
    "rest",
    "hateoas",
    "spring",
    "data",
    "react"
  ],
  "author": "Lingar",
  "license": "Apache-2.0",
  "bugs": {
    "url": "https://github.com/spring-guides/tut-react-and-spring-data-rest/issues"
  },
  "homepage": "https://github.com/spring-guides/tut-react-and-spring-data-rest",
  "dependencies": {
    "react": "^16.5.2",
    "react-dom": "^16.5.2",
    "react-router": "^4.3.1",
    "react-router-dom": "^4.3.1",
    "rest": "^1.3.1"
  },
  "scripts": {
    "watch": "webpack --watch -d"
  },
  "devDependencies": {
    "@babel/core": "^7.1.0",
    "@babel/plugin-proposal-class-properties": "^7.4.4",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.2",
    "webpack": "^4.19.1",
    "webpack-cli": "^3.1.0"
  }
}

型

Maven

来源：https://stackoverflow.com/questions/56356521/cannot-find-module-babel-plugin-proposal-class-properties-reactspring-boot

3条答案

按热度按时间

9rygscc11#

也有类似的问题。软件包版本号同步后

"devDependencies": {
    "@babel/core": "^7.10.1",
    "@babel/node": "^7.10.1",
    "@babel/plugin-proposal-class-properties": "^7.10.1",
    "@babel/polyfill": "^7.10.1",
    "@babel/preset-env": "^7.10.2",
    "@babel/preset-react": "^7.10.1",
    ...

字符串
@被添加到插件名称前面（babel.config.js）

const plugins = [
    // transforms static class properties as well as properties declared
    // with the property initializer syntax
    '@babel/plugin-proposal-class-properties'
    // 'babel/plugin-proposal-class-properties' doesn't work:
    // ERROR in ./server/index.js
    // Module build failed (from ./node_modules/babel-loader/lib/index.js):
    // Error: Cannot find module 'babel/plugin-proposal-class-properties' from 
];

型
它运行良好。

赞(0）回复(0）举报 2023-08-03

uxhixvfz2#

正如@DraganS所说。我设置所有的插件与相同的版本现在它工作正常！
“@babel/core”：“^7.10.1”

赞(0）回复(0）举报 2023-08-03

d4so4syb3#

很抱歉迟到的回复，但这可能会对你有所帮助，

它是自己创建的简单的webpack文件，所以你可以参考
package.json

{
  "name": "practice",
  "main": "index.js",
  "devDependencies": {
    "@babel/core": "^7.22.8",
    "@babel/plugin-proposal-class-properties": "^7.18.6",
    "@babel/preset-env": "^7.22.7",
    "babel-loader": "^9.1.3",
    "webpack": "^5.86.0",
    "webpack-cli": "^5.1.4"
  },
  "dependencies": {
    "css-loader": "^6.8.1",
    "sass": "^1.63.6",
    "sass-loader": "^13.3.2",
    "style-loader": "^3.3.3"
  }
}

字符串

webpack.config.js

const path = require('path');

module.exports = {
    entry: './src/index.js',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, './dist'),
    },
    mode: 'none',
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/env'],
                        plugins: ['@babel/plugin-proposal-class-properties']

                    }
                }
            }
        ]
    }
}

型

赞(0）回复(0）举报 2023-08-03

我来回答

maven 无法找到模块“@babel/plugin-proposal-class-properties”- React+Spring-boot

3条答案

相关问题

热门标签

最新问答