SZJX

SZJX

When programming Javascript files with Emacs/Vim etc. a linter like ESLint is likely enabled. In my case it seems that the default airbnb style configuration is not very compatible with default Javascript files generated by Phoenix. For example, airbnb standard insists on using singlequotes for strings while Phoenix generates double-quoted ones. Also it insists on appending semicolons which are by default not there. This results in the linter showing a lot of errors in a JS file.

I would like to know, is there any kind of standard followed by Phoenix when generating its Javascript files, or is there any convention/consensus in the community? Ideally I would be able to set the default options of ESLint to report much fewer errors.

Or is it the case that this really varies a lot from person to person and since the Javascript files generated by default are relatively few, the user should just modify the default files to their own taste and follow their own standard when writing new JS files?

Showing Posts 1 to 10

chrisalley

chrisalley

If Phoenix is going to follow a style guide for generated JavaScript files, Standard should be considered. In at least one respect Standard is closer to Elixir’s syntax than the Airbnb style guide since it gets rid of those noisy semicolons.

sotojuan

sotojuan

Agreed. I actually find Phoenix’ default JavaScript strange and ugly lol. I get it that they tried to make it look like Elixir, but it’s a different language.

Most people use single quotes in JavaScript, so most pre-configured linters will prefer them. I also use Standard for all my JavaScript stuff. I recommend that Phoenix at least generate JavaScript that conforms to most people’s uses (Airbnb or Standard).

peerreynders

peerreynders

[quote=“SZJX, post:1, topic:1745”]the user should just modify the default files to their own taste and follow their own standard when writing new JS files?
[/quote]
This would be my assumption - (unless there is re-generated JS in Phoenix which I haven’t come across yet). Obviously the Phoenix project has made some of it’s own choices (for whatever reason) but that shouldn’t override your needs (i.e. your custom eslint configuration).

So I’d basically “clean up” the initial JS assets placed by mix in web/static/js to conform with my chosen standard and move forward from there.

Probably a lost cause given how divisive just the semicolon issue is (e.g. hence the existence of semistandard).

sotojuan

sotojuan

Well, it’s been a while and no one’s complained about the lack of semis in the default JavaScript, so maybe we can get away without them. That said, any modern styleguide is fine. I just think it looks weird at the moment.

@SZJX with ESLint you can do eslint --fix to attempt to format any JS files to your configuration. Works for standard as well (standard --fix.)

ibgib

ibgib

I had to change mine to use semi-colons at the end of lines, but I figured it was just a starter “example” app js. That said, if it’s at all possible, at the very least explicit semi-colons would be proper since javascript has odd rules for the implicit semi-colons (i.e. it isn’t just a style thing).

sotojuan

sotojuan

Sure, but the standard linter lints against the gotchas of no semis. But yes, without it you’ll be in danger!

peerreynders

peerreynders

ES5 automatic colon insertion (ASI) - have to admit it feels bolted on after the fact. If they were serious they should have designed the language without semicolons in the first place (Clojure even downgraded commas to whitespace in many places).

Even as an explicit semicolon author you may want to defensively prefix your IIFEs with a semicolon if there is any possibility of your script being included in/concatenated to another “non-semi” script:

;(function () {
  /* */
}());
ibgib

ibgib

;(function () {
  /* */
}());

Ouch. Yeah. Apparently there are a ton of gotchas with implicit semi-colons, and that is yet another new one to me. I would think that is all the more reason to have it in the learning material for beginners, as I’m not sure I agree with that particular video’s quote of “I mean really, who does that?” Because new learners specifically don’t know what to do, and his example of bear is trivial. If the return value is a long function that would possibly wrap, such as:

return 
    myLongJavaScriptName.someArrayProperty.forEach(function(i) { return isFoo(i) })

So this would be a mistake that would not be caught until the beginner was farther down the line and had no idea about this implicit semi-colon problem, etc. etc., yada yada yada. So me personally, I can’t remember all the little rules because my memory is horrible, so it is far easier to just say “use semi-colons” explicitly. Then if I forget one, probably no biggie (and a linter will catch it).

chrisalley

chrisalley

The Standard linter will pick up on lines that begin with a character that should be prefixed with a semicolon for safety purposes. From the Standard rules:

Never start a line with (, [, or `. This is the only gotcha with omitting semicolons, and standard protects you from this potential issue.

peerreynders

peerreynders

… which is covered via the /*eslint semi: ["error", "never"]*/ rule.

My most recent point was that /*eslint semi: ["error", "always"]*/ really needs an option to flag non-prefixed IIFEs as well - because as it stands the “implicit semicolon” authors are forcing the “explicit semicolon” authors to defensively prefix their IIFEs with an extra semicolon - not to satisfy the ECMA spec per se but to guard against a blind-spot in ASI that is exposed when merging or concatenating scripts authored against divergent linting rule sets.

Where Next? Top

Trending in Questions Top

RSP87
I’m working on a project that simulates the bumbl example in the programming phoenix book. It acts almost like an email client. We have a...
New
nseaSeb
Hello, I know there is an approach for handling lists that allows for optimized traversal, but I can’t recall the specific method (somet...
New
brecabral
Documentation While reading the Scoped Routes section, I noticed that the documentation currently refers to a problem without explainin...
New
RemyXRenard
I’m seeing that a list inside a Kino.DataTable will be interpreted as a charlist, even if the Kino.configure() is set to charlists: :as_l...
New
velrest
So my question is quite simple and i have found no conclusive answer on forum, google or AI. Should we use :erlang.float for Integer to ...
New
samoloth
Hi, I’ve just set up an application with ash_authentication. There is only magic link strategy for now, so there is no confirmation add o...
New
asweet-confluent
I recently noticed that Elixir’s Logger defaults its primary log level to :debug when no :logger, :level application configuration is pre...
New

Other Trending Topics Top

JesseHerrick
Hey, I’m Jesse and I’m the main contributor behind Dexter, a full-featured, lightning-fast Elixir LSP optimized for large codebases. It s...
New
mudasobwa
I am happy to introduce the very α version of the new programming language compiled to BEAM. Welcome Cure. It has literally three kille...
New
marciok
Hi there! We created Gust: A task orchestrator inspired by Airflow. For those who have never heard about Aiflow, it’s a Python-based wor...
New
mhanberg
Hi everyone! The first release candidate for the Expert language server project is now available! We’ve published a press release detai...
New
jimsynz
Beam Bots (or just BB for short) is a framework for building fault-tolerant robotics applications in Elixir using familiar OTP patterns. ...
New
Dmk
Xamal is a deployment tool for Elixir apps that deploys native releases to bare metal servers over SSH. It’s a port of GitHub - basecamp/...
New

Latest on Elixir Forum

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews