Laravel ReactJs:我的js(reactjs)文件更改后更改未反映 [英] Laravel ReactJs : Changes are not reflecting after change in my js(reactjs) file
问题描述
我正在使用 Laravel 中的 Reactjs .这里我在React组件中进行了一些更改,当我刷新浏览器时,更改不会显示.
I'm using the Reactjs in Laravel.Here I made some changes in my React Component and when I refresh my browser then changes are not shown.
文件:
-
resources/views/welcome.blade.php
resources/views/welcome.blade.php
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>arjunphp.com | Laravel 5.6 with React JS</title>
<link href="{{asset('css/app.css')}}" rel="stylesheet" type="text/css">
</head>
<body>
<div id="example"></div>
<script src="{{asset('js/app.js')}}" ></script>
</body>
</html>
资源/资产/js/app.js
resources/asset/js/app.js
/**
* First we will load all of this project's JavaScript dependencies which
* includes React and other helpers. It's a great starting point while
* building robust, powerful web applications using React + Laravel.
*/
require('./bootstrap');
/**
* Next, we will create a fresh React component instance and attach it to
* the page. Then, you may begin adding components to this application
* or customize the JavaScript scaffolding to fit your unique needs.
*/
require('./components/Example');
资源/资产/js/components/Example.js
resources/asset/js/components/Example.js
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import Button from '@material-ui/core/Button'
export default class Example extends Component {
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-8 col-md-offset-2">
<div className="panel panel-default">
<div className="panel-heading">Example Component</div>
<div className="panel-body">
I'm an example component tomas!
</div>
<Button size="small" color="primary" href="#" target="_blank">
Go To Course
</Button>
</div>
</div>
</div>
</div>
);
}
}
if (document.getElementById('example')) {
ReactDOM.render(<Example />, document.getElementById('example'));
}
刷新浏览器时,我在此组件中添加了一个按钮,更改未显示在浏览器中.
I add a Button in this component when I refresh the browser the changes are not shown in browser.
屏幕截图:
推荐答案
如果不编译,是否编译react.js代码:
did you compile react.js code if not :
npm run dev
并清除浏览器缓存以查看更改
and clear browser cache to see changes
Laravel文档
请记住,每次更改时都应运行npm run dev命令Vue组件.或者,您可以运行npm run watch命令进行监视并在每次使用时自动重新编译您的组件修改.
Remember, you should run the npm run dev command each time you change a Vue component. Or, you may run the npm run watch command to monitor and automatically recompile your components each time they are modified.
也需要做出反应.
这篇关于Laravel ReactJs:我的js(reactjs)文件更改后更改未反映的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!