Comments (19)
jsx isn't valid javascript so, it should not use a .js extension
from react-starter-kit.
I prefer the use of .js
as it's now
from react-starter-kit.
Every .css file is valid SCSS, but a .scss file may not be valid CSS
Every .js file is valid TypeScript, but a .ts file may not be valid JS (ES3/5/6/2015/2016)
It feels a bit audacious to me that Facebook would put their custom superset into the subset's extension :(
from react-starter-kit.
Irrelevant. JSX syntax can be used (and it is) in every javascript source file. Closing
from react-starter-kit.
Components in the starter kit currently use .js
file extension for two reasons:
- As of now, it's the default file extension for React components used at Facebook. See react-tools
jsx
command-line build tool, which ignores.jsx
files unless you specified-x jsx
parameter. Also see React examples and Flux examples. - You can reference these components in your source code without specifying file extension, e.g.
require('./MyComponent')
instead ofrequire('./MyComponent.jsx')
and still be able to use "navigate to source" feature in your code editor.
Do you think that the benefits of having .jsx
file extension for React components outmatch these two?
from react-starter-kit.
@koistya JSX adds new syntax to ES just as TS does, they're both extensions/supersets that don't follow the ES spec or any stage'd proposal.
FWIW async
/await
is a Stage 3 proposal, but you raise an interesting point on if proposals TC39 is considering should be considered "valid-enough" ES.
from react-starter-kit.
@ehartford JSX it's just an extension to JavaScript, not a new language like TypeScript or CoffeeScript. Can you tell the same about async/await
stuff which isn't valid JavaScript either?
from react-starter-kit.
@ehartford .jsx
is recommended by AirBnb guys, .js
by Facebook guys.
from react-starter-kit.
+1 to avoid confusion
from react-starter-kit.
+1 editors syntax highlighting
from react-starter-kit.
Create react app does not use jsx too
from react-starter-kit.
+1
from react-starter-kit.
+1
from react-starter-kit.
good point
from react-starter-kit.
FWIW a relevant discussion on this in the React repo:
facebook/react#3582 (comment)
from react-starter-kit.
@langpavel What about Facebook deprecating react-tools (last comment on facebook/react#832) and recommending .jsx extension?
@koistya You're confused.
JSX is a preprocessor step that adds XML syntax to JavaScript.
Typescript is a typed superset of JavaScript that compiles to plain JavaScript.
See the 2 keywords here: preprocessor
, compiles
? Both offer different features but both work the same way.
As a newcomer to the React World, finding jsx syntax inside js is misleading. Everyone here's telling you it's confusing. You do as you please but you're going against your community, that's not really user-centric approach.
from react-starter-kit.
facebook is recommending using .jsx extension how is this an invalid issue?
from react-starter-kit.
@ehartford Do you have a link for that, because the link PixnBits posted is React saying not to use .jsx
.
from react-starter-kit.
Irrelevant. JSX syntax can be used (and it is) in every javascript source file. Closing
If that's so, how come no browser will interpret a JSX <script> unless its 'type' attribute is specified as 'text/babel' (which will tell Babel to interpret it) rather than 'text/javascript' ?
from react-starter-kit.
Related Issues (20)
- Need help building an old website from 2016 HOT 5
- Error 500: Unexpected token < in JSON at position 0 HOT 3
- SPAM
- 'Cannot find module' Error for cached modules in VSCode HOT 1
- Minor issue running 'Relay' with Yarn HOT 1
- Cannot find module ... TypeScript error in VSCode HOT 1
- Hot Reload not working properly HOT 1
- Hot Reload CSS and JS files changes HOT 1
- Cannot open started application due to Firebase error HOT 2
- site.manifest error - comma missing
- What kind of API token templates should I use? HOT 1
- Where's node_modules?
- Where's node_modules? HOT 1
- Error on first start. TT HOT 2
- Network: use --host to expose HOT 1
- Codespaces not working with "Use Template" (workaround: clone/fork/duplicate repo) HOT 5
- The engine "node" is incompatible with this module. Expected version "10". Got "18.14.0" HOT 5
- Shipping with Google_Cloud_Credentials Issue HOT 2
- Login Dialog is not showing up
- Unable to add packages using Yarn HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-starter-kit.