Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Neste route router error - blank page #4893

Closed
ShintaroNippon opened this issue Apr 1, 2017 · 3 comments
Closed

Neste route router error - blank page #4893

ShintaroNippon opened this issue Apr 1, 2017 · 3 comments

Comments

@ShintaroNippon
Copy link

ShintaroNippon commented Apr 1, 2017

import ScheduleCreate from './components/schedule/create'

<Route path='schedule/create' component={requireAuth(ScheduleCreate)} />

import React from 'react'

 export default class ScheduleCreate extends React.Component {
    render() {
        return(
            <div class="container">
                <h1>Create</h1>
            </div>
        )
    }
}

And when i put the link /schedule/create or making refresh its get empty page with error on bundle files

do you know how to do nested route router ?

My routes are

<Route path='/' component={Layout}>
		<IndexRoute component={Login} />
		<Route path='dashboard' component={requireAuth(Dashboard)} />
		<Route path='schedule' component={requireAuth(Schedule)} />
    <Route path='schedule/create' component={requireAuth(ScheduleCreate)} />
		<Route path="*" component={NotFound} />
	</Route>

i have already tried

<Route path='schedule' component={requireAuth(Customer)} />
         <Route path='/create' component={requireAuth(ScheduleCreate)} />
</Route>
ReactDOM.render(
	<Provider store={store}>
		<Router history={browserHistory} routes={routes} />
	</Provider>,
	document.getElementById('app')
);

Thanks in advance Carlos Vieira

Why i'm getting a blank page when i refresh schedule/create ?

@pshrmn
Copy link
Contributor

pshrmn commented Apr 1, 2017

99% sure your issue is that your <script> tag has a relative link. Make it absolute.

<!-- do this -->
<script src="/static/bundle.js"></script>
<!-- not -->
<script src="static/bundle.js"></script>
<!-- or -->
<script src="./static/bundle.js"></script>

@pshrmn pshrmn closed this as completed Apr 1, 2017
@ShintaroNippon
Copy link
Author

I believe you are right but
I'm using web pack

were can i change that

var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var webpack = require('webpack');
//var debug = process.env.NODE_ENV !== 'production';

module.exports = {
    context: __dirname + '/app',
    //devtool: debug ? 'inline-sourcemap' : null,
    entry: {
        app: './src/app'
    },
  //  debug: false,
    output: {
        path: './public/static',
        filename: '[name].bundle.[hash].js'
    },
    module: {
        loaders: [
            {
                test: /\.js?$/,
                loader: 'babel-loader',
                exclude: /node_module/,
                query: {
                    presets: ['es2015', 'react', 'stage-0'],
                    plugins: ['react-html-attrs', 'transform-class-properties', 'transform-decorators-legacy']
                }
            },
            {
                test: /\.(scss|sass|css)$/,
                loader: ExtractTextPlugin.extract('css?sourceMap!sass?sourceMap')
            },
            {
                test: /\.(woff|woff2|eot|ttf|svg|otf)$/,
                exclude: /node_module/,
                loader: 'url-loader?limit=100000'
            },/*
            {
                test: /\.(jpe?g|png|gif|svg)$/i,
                exclude: /node_module/,
                loaders: [
                  'file?hash=sha512&digest=hex&name=images/[name].[ext]',
                  'image-webpack?bypassOnDebug&optimizationLevel=7&interlaced=false'
                ]
            }*/
            /*{
                test: /\.scss$/,
                loaders: ["style", "css?modules&importLoaders=2", "sass", "bulma"]
            }*/
        ]
    },
    plugins: [
        /*new webpack.optimize.DedupePlugin(),
        new webpack.optimize.OccurenceOrderPlugin(),
        new webpack.optimize.UglifyJsPlugin({
            mangle: false,
            sourcemap: false
        }),
*/

        new HtmlWebpackPlugin(
            {
                title: 'Vikings Porto FrontEnd',
                template: __dirname + '/app/src/public/pages/base.html',
                chunks: ['app']
            }
        ),/*
        new HtmlWebpackPlugin(
            {
                filename: 'about.html',
                template: __dirname + '/app/templates/base.html',
                chunks: ['about']
            }
        ),*/

	new webpack.DefinePlugin({
     		'process.env':{
        		'NODE_ENV': JSON.stringify('production')
      		}
    	}),
       /*	new webpack.optimize.UglifyJsPlugin({
      		compress:{
        		warnings: true
      		}
    	}),*/
        new ExtractTextPlugin('[name].bundle.[hash].css')
    ],
    devServer: {
        historyApiFallback: true,
        contentBase: './',
        hot: true,
        headers: { "Access-Control-Allow-Origin": "*" }
    }
};

@ShintaroNippon
Copy link
Author

i already fixed it
many thanks you were pretty syre

@remix-run remix-run deleted a comment from HarshwardhanSingh Feb 6, 2018
@lock lock bot locked as resolved and limited conversation to collaborators Jun 5, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants