Javascript 设置与Grails进行反应_Javascript_Reactjs_Grails_Webpack_Bundle

Javascript 设置与Grails进行反应

javascript reactjs grails webpack

Javascript 设置与Grails进行反应,javascript,reactjs,grails,webpack,bundle,Javascript,Reactjs,Grails,Webpack,Bundle,我目前正在致力于将React与Grails（2.3.11）集成。然而，即使是最基本的设置似乎也给我带来了困难。我已经设置了我的文件和文件夹结构，这是我在以前的项目中所做的，但是我的bundle.js文件似乎不想被找到。无论我改变路径多少次，我都会得到404 My package.json文件： { "name": "react_test", "version": "1.0.0", "description": "Grails with React", "main": "inde

我目前正在致力于将React与Grails（2.3.11）集成。然而，即使是最基本的设置似乎也给我带来了困难。我已经设置了我的文件和文件夹结构，这是我在以前的项目中所做的，但是我的bundle.js文件似乎不想被找到。无论我改变路径多少次，我都会得到404

My package.json文件：

{
  "name": "react_test",
  "version": "1.0.0",
  "description": "Grails with React",
  "main": "index.js",
  "license": "MIT",
  "dependencies": {
    "axios": "^0.18.0",
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.4",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "react": "^16.4.1",
    "react-dom": "^16.4.1",
    "react-redux": "^5.0.7",
    "react-router-dom": "^4.3.1",
    "redux": "^4.0.0",
    "redux-thunk": "^2.3.0"
  },
  "devDependencies": {
    "redux-logger": "^3.0.6",
    "webpack": "^4.12.0",
    "webpack-cli": "^3.0.8"
  },
}

我的root.gsp文件，该文件应拾取bundle.js文件并呈现react代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Grails with React</title>
    <script src="../../../src/react/public/bundle.js"></script>
  </head>
  <body>
    <div id="root">
      <p>React broke down</p>
    </div>
  </body>
</html>

最后是我的简单起始文件：

import React from 'react';
import {render} from 'react-dom';

class App extends React.Component {
  render () {
    return <p> Hello, World!</p>;
  }
}
render(<App/>, document.getElementById('root'));

从“React”导入React；
从'react dom'导入{render}；
类应用程序扩展了React.Component{
渲染（）{
返回你好，世界！；
}
}
渲染(
非常感谢您给我的任何建议或帮助！我愿意尝试！谢谢！
经过大量实验，我发现了需要做的事情。因为这是一个Grails应用程序，它编写得非常具体，必须输出到正确的文件夹中
将脚本行更改为：
<g:javascript src="bundle.js"></g:javascript>

这就解决了问题！同时使用gsp和react的原因是什么？最好将react前端与grails api分开。
<g:javascript src="bundle.js"></g:javascript>

var BUILD_DIR = path.resolve(__dirname, 'web-app/js');