2
It is possible to run the webpack transpilator in the client-side without installing and running it on a Node.js server ?
I am currently trying to implement a SPA application using React 15.1.0 integrated with Babel-core 5.8.23. However my server-side solution is proprietary and I have no possibility to change it due to the support of updates, and it contains an integration between services and applications very complex, where even there is a Node.js service for it.
Which path or settings can I follow to run React developed only on the front-end side with execution also only on the client-side.
OBS: currently my main obstacle is the import of modularized components that presents the error .. Uncaught ReferenceError: require is not defined .
Test Codes:
index.html and main.js
// Arquivo "main.js"
import App from './components/App.js';
ReactDOM.render(
<App />,
document.getElementById('app')
);<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Aprendendo React</title>
<meta name="description" content="Testes com código ReactJS">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script type="text/babel" src="main.js" ></script>
</head>
<body>
<div id="app"></div>
</body>
</html>App.js
export default class App extends React.Component {
render: function() {
return <h1>React Ok</h1>;
}
});
Why not do a separate project and this code as a micro-service? So you can compile the js file separately from your other project.
– Sergio
I am extremely limited because to access my database I need to leave the code integrated to my server-side that currently uses the Freemaker to create the MVC layer compiled in Java that interprets code and includes objects in JS.. but I was also thinking about this solution where I would have another Node webpack server, but I still don’t understand how I could make it work.
– lorduakiti
Can’t you create an end-point on your current server for the new ajax only service? so you create a new project and build with Node, but everything runs in the browser and only talks to the server via ajax.
– Sergio
@Sergio I already have this server access feature via REST API with Oauth authentication, but how could I run/configure this Node.js project on a second server for page processing? you have some reference to it?
– lorduakiti
Can you explain what you mean by "page processing"? refer to compiling with webpack?
– Sergio