So after playing with Expo for a bit I've decided that I'd rather develop with the option for native features if needed.
I've followed all the steps here: https://reactnative.dev/docs/environment-setup and double checked them.
I ran npx react-native init <myprojectname> which was create successfully. I've then copied my minimal existing code to my new project, and now I can't run the app. I was able to run my code when it was on expo, and I was able to run the initial native setup before copying my code.
The issue doesn't seem to be related to the code itself though. Maybe some configuration?
It says it is Unable to resolve module.. and that None of these files exist.
These files most definitely exist.
I've tried cleaning the app's cache from my phone. Completely deleting it and reinstalling.
I've tried renaming my screen name from HomeScreen.tsx to HomeScreen.native.tsx.
Nothing seems to work. What is the issue here?
This is the error screen
And this is my files structure:
I need help on how should I do compile/build my project using Next.js when I use a custom server.
I actually use Nest.js (TypeScript Node.js Framework) as my Backend and wrap my Next.js inside it (since Nest.js is node based so I think this should work) and it actually working.
This is one of the tutorial that I followed: https://javascript.plainenglish.io/render-next-js-with-nestjs-did-i-just-made-next-js-better-aa294d8d2c67.
And when I tried to build production, Next.js give me error like this
So basically, when I use nest build command, it successfully compiled but only the backend part (which is Nest.js).
Whenever I tried to run into localhost, it would error and said the same thing above.
And the same as the second command (which is I tried to add next build command), it would show the same error.
I know where is the problem is (they basically need the compiled .next/ folder) but kinda confused how to solve this.
Do you have any idea on how I should tell the compiler that the pages/ folder has been moved into src/client/pages?
[EDIT]
Just for your information, this is my folder architecture.
Any kind of ideas would be a really help. Thanks guys!
I just fixed my own issue right after several minutes I post this even I've struggle for like hours!
So, just want to let you guys know if anyone ever comes with the same issue. Somehow, my solution is comes because this Next.js CLI docs, so thanks to that.
What I did is just simply change the directory first into the right Next.js folder's code and start compile it. I did it from package.json build scripts.
"scripts": {
"build": "NODE_ENV=production nest build && NODE_ENV=production cd src/client && next build"
...
}
I couldn't find the proper answer for my problem so if there is any same question please let me know.
I'm new in ReactJs and I was wondering if anyone could help me.
I have the react project which is using Webpack to bundle components. It works fine with npm start on port 3000 but I need to run it without the server and I want to see it by opening the HTML file. The App just calls APIs in its components so it doesn't need the server.
I have the same project and it works well but because it uses Webpack as well it's hard to find out what is missing in my project.
I would be grateful if anyone could help me!
Thanks
To generate an html file you can run npm run build that will generate all your static files in the build directory including a static html.
However i think you would still need a server to make async calls.
I am using ionic to create a mobile app following the link at http://ionicframework.com/docs/v2/getting-started/tutorial/.
ionic start my-mobileapp sidemenu --v2
Then I start my app in a browser as follows.
ionic serve
All of this worked until I changed my file extensions from *.js to *.ts.
Error: Cannot find module './pages/getting-started/getting-started'
from '/Users/jwayne/git/my-mobileapp/app'
If I simply toggle/change the file extensions back to js then things work.
My question is how does ionic know that code stored in a js file is actually TypeScript and not JavaScript if TypeScript code is stored in a js file?
I think you should be typing that...
ionic start my-mobileapp sidemenu --v2 --ts
If you want to work with Typescript, you should start a project with the --ts flag, as suggested above. Then, you should go about changing parts of your code to make them Typescript compliant.
See here for a good short overview of Javascript (ECMA6) VS Typescript:
http://www.joshmorony.com/converting-ecmascript-6-to-typescript-in-ionic-2/
As a side note, if your project is not too complex yet, I highly suggest you follow the guide and move to Typescript.
So I was starting researching about angular2 and since I saw so many references to typescript being prefered I am trying to switch to it from javascript. Problem is, I saw a nice little guide I could follow to install it all in eclipse (angular, javascript, everything needed to launch the 5 minute guide code on the main page of angular), so I did it and managed to get it to work.
Now I would like to do the same with typescript, but I find myself lost since it doesn't seem to be working, I can't launch code, it's like node.js isn't working anymore, but since I do not know what the expected result is, I am not sure what is missing.
For example, I re did the 5 minute guide and notice as a difference that I do not have the installation of the modules, nor any run-as configuration ready, in fact, I can't manage to run as any typescript code I try to do.
What I did was:
1- Install Eclipse Mars, other guys uses older versions
2- Install Node.js
3- Install WildFly Server
4- Install TypeScript plugin https://marketplace.eclipse.org/content/typescript
5- Import my project in eclipse, you may have to create a new static web project and add your files in there. The 5 minute quick start is not an eclipse web project so you may not be able to import this. Do not forget to copy and past the same structure with the node modules that you have
6- Right click on the project > Configure > Enable Typescript Builder
7- Right Click the project > Properties > TypeScript > Compiler and configure as follows:
I hope this will do it for you.
Remember, this plugin does not respect json configuration file, so you have to do this manually as in the screenshot. Also, if you are going to provide arguments to your component constructor, You will have errors. Let me know if you got those. Another thing to mention is that using some annotations like #Input will not work, you will have to use inputs:[] inside your #Component annotation.
You can try to add those plugins on top of Mars:
https://github.com/angelozerr/angular2-eclipse
https://github.com/angelozerr/typescript.java
Those 2 are incubating but already provide good features. There is another one, that I didn't try but which has some popularity:
https://github.com/palantir/eclipse-typescript
Eclipse >= Neon
sudo npm install -g angular-cli (ng help must work)
See: https://github.com/angelozerr/angular2-eclipse
Install it and restart Eclipse
Open a .ts file
Eclipse Oxygen
Default javascript installation, then added the default free plugin for angular 2 / typescript from here:
angular2.ide - http://oss.opensagres.fr/angular2-eclipse/1.3.0/
After installing I opened an existing Angular 4 / TS project, worked fine. I then installed support for .scss from http://www.liclipse.com/text/updates. All setup and configured with Typescript 2.4.1 / nodejs v6.9.4.
But within days it now fails to open .ts files at all. Re-installation of the ng plugin did not fix it, I uninstalled liclipse plugin and no change either. It basically leaves eclipse unusable for ng4 projects as is.
The logs show the following errors.
org.eclipse.core.runtime.CoreException: Plug-in "ts.eclipse.ide.jsdt.ui" was unable to instantiate class "ts.eclipse.ide.jsdt.internal.ui.editor.TypeScriptEditor".
at org.eclipse.core.internal.registry.osgi.RegistryStrategyOSGI.throwException(RegistryStrategyOSGI.java:194)
at org.eclipse.core.internal.registry.osgi.RegistryStrategyOSGI.createExecutableExtension(RegistryStrategyOSGI.java:188)
at org.eclipse.core.internal.registry.ExtensionRegistry.createExecutableExtension(ExtensionRegistry.java:905)
...
Caused by: java.lang.NoClassDefFoundError: org/eclipse/wst/jsdt/ui/text/JavaScriptSourceViewerConfiguration
at java.lang.Class.getDeclaredConstructors0(Native Method)
at java.lang.Class.privateGetDeclaredConstructors(Unknown Source)
...
Caused by: java.lang.ClassNotFoundException: An error occurred while automatically activating bundle org.eclipse.wst.jsdt.ui (441).
at org.eclipse.osgi.internal.hooks.EclipseLazyStarter.postFindLocalClass(EclipseLazyStarter.java:112)
at org.eclipse.osgi.internal.loader.classpath.ClasspathManager.findLocalClass(ClasspathManager.java:529)
...
Caused by: java.lang.ClassFormatError: Name index 1 in LocalVariableTable has bad constant type in class file org/eclipse/wst/jsdt/internal/core/JavaModelManager
I found
TypeEcs plugin for Typescript
it provide below.
•Syntax highlighting
•Code Completion
•Code Outline
•Find References
•Rename / Refactor
•Open Type
•Code Compilation
•Format Code
•Comment Code
•Open Declaration
•Mark Occurences
•Type Script Debug