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

After the project build, run index.html to display the blank interface. #54

Closed
shiran1992 opened this issue Nov 20, 2017 · 14 comments
Closed

Comments

@shiran1992
Copy link

After the project build, run index.html to display the blank interface.
default

@jirikolarik
Copy link
Member

How do you run it? You need to star dev server with npm start in project directory

@shiran1992
Copy link
Author

I see what you mean, that's fine. But I've developed it on this framework, and now I need to build a package, which is the dist folder.In this folder(dist),I ran index.html, which shows the blank, which is what I've just done. -------Thank you very much for your reply! (from a Chinese guy who is working overtime)

@jirikolarik
Copy link
Member

You need to run a server, which will server index.html and assets, what you can do with running npm run server or node server or with php for example, in this case you have to run php -S localhost:8080 in dist folder.

@jirikolarik
Copy link
Member

You can also deploy this code to surge for example and they will do this for you

@shiran1992
Copy link
Author

Thank you for your reply .I did what you said, and if you use your empty project, no problem. However, after I have developed on your foundation, the build comes out wrong.
default
My package.json
default

@shiran1992
Copy link
Author

.babelrc
default
I think my question should be here. What do you think?

@jirikolarik
Copy link
Member

Try to move transform-runtime and transform-decorators-legacy out of development plugins to just plugins like here:

screen shot 2017-11-21 at 09 18 26

I think this may be it. Because transform-runtime is needed while building the project and that is happening in production env (you can see in packages.json: "build": "NODE_ENV=production webpack --config ./webpack.production.js --profile --colors"). Give it a shot and let me know if it helped

@shiran1992
Copy link
Author

Now I can look at the interface, but the style is not normal .
default

@jirikolarik
Copy link
Member

If you wrote API in server.js, you have to run it as well. It is preconfigured to also serve builded project, so if you run npm run server both of them - api and react app should work, php -S localhost:8080 is not an option in this case

@jirikolarik
Copy link
Member

Did it worked? @shiran1992

@shiran1992
Copy link
Author

I'm very sorry. I have been busy lately. I didn't pay attention to git news. Then you offered the solution, I tried it, the style was problematic, and then I didn't find the solution. Over the weekend, I used the scaffolding create-react-app provided by facebook's official website to move the previously written functional code, which is now running smoothly.

@shiran1992
Copy link
Author

I just found out that there is a problem that after the migration, the CSS properties that were used to limit the number of content rows in

are not working, so please help me to check it. It was this before, and it worked.
default

@shiran1992
Copy link
Author

JetBrains, I adore this company. Are you near here?

@jirikolarik
Copy link
Member

I'm glad it worked out for you. Switching to another build setup shouldn't have any effect how css works. If you have some css preprocessors which modifies them, then it might, but I don't believe so. Check compiled css in you browser. Yeah, they're just next door :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants