How to get all available time zones in Moment Timezone? - timezone

I want to get a list of all available time zone names, I use moment.tz.names function for this purpose, as you see:
import moment from "moment";
import "moment-timezone";
public availableTimeZones = moment.tz.names();
But I get null. I use TypeScript + Aurelia + Webstorm to develop the program, and I installed "moment-timezone" and "moment":
npm install --save moment
typings install dt~moment --global --save
npm install --save moment-timezone
typings install dt~moment-timezone --global --save
Actually, I have to add all available time zones by moment.tz.add .
I want to have all available time zone. I don't want to add some of the zones and then use them.
Could you please help me?

import "moment-timezone-with-data" is the solution.

Related

upgrade #angular/material get SyntaxError: Unexpected token '<'

Currently I am working with a legacy angular mixed asp.net core 2.2 web project. It is not a pure angular template structure, the previous programmer modify the project structure so let angular component web page work together with asp.net cshtml page,MVC C# controller. So he can reused his previously asp.net C# code(get data from backend jbase database) from another old project. which is not recommend way to do angular. But that is the way he did that.
We currently need to upgrade this project's angular version from 7.2.1 to latest version. as we need to add new feature in this project.
But we got some issue.
As the project structure changed ,not pure angular
we can not just follow google angular upgrade guide https://update.angular.io/?v=7.2-8.0 to upgrade
For example from version 7.21. to version 8
if I do this command ng update #angular/cli#8 #angular/core#8
Below highlight part still stuck in version 7.2.1 , will not updated automatically in package.json
please see picture 1
https://drive.google.com/file/d/1E7LDdwv724mP9WVBrfJVKLO7LAW1C4EW/view?usp=sharing
I have to manually to do below commands to update each individual angular library one by one
npm install --save #angular/animations#8
npm install --save #angular/cdk#8
npm install --save #angular/common#8
npm install --save #angular/compiler#8
npm install --save #angular/core#8
npm install --save #angular/forms#8
npm install --save #angular/material#8
npm install --save #angular/platform-browser#8
npm install --save #angular/platform-browser-dynamic#8
npm install --save #angular/router#8
After I did above commands, please see below image, the highlighted part updated to version 8
Please see picture 2
https://drive.google.com/file/d/1tN0NVqky0rvuXR45blNmjpBwSeVHnyzJ/view?usp=sharing
I also noticed when update #angular/marterial fromversion 7.2 to version 8.0
Writing way of #angular/marterial import part need to change.
Instead of importing from #angular/material, you should import deeply from the specific component. E.g. #angular/material/button. ng update will do this automatically for you.
for example.
when in #angular/material 7.2.1, in the module.ts we import like below
import { MatDialogModule,MatIconModule,MatNativeDateModule,MatProgressSpinnerModule,MatTooltipModule,
MatStepperModule} from '#angular/material';
please see picture 3
https://drive.google.com/file/d/1Nb1S7QzH0B0qcnx-OaOnj9U4jQUB8lRw/view?usp=sharing
after #angular/material version 8, we need to write as below
import {MatDialogModule} from '#angular/material/dialog';
import {MatIconModule} from '#angular/material/icon';
import { MatNativeDateModule } from '#angular/material/core';
import {MatProgressSpinnerModule} from '#angular/material/progress-spinner';
import {MatTooltipModule} from '#angular/material/tooltip';
import {MatStepperModule} from '#angular/material/stepper';
please see picture 4
https://drive.google.com/file/d/13lEL-rkKVvC_CPK_SDYeUOJ6fysEkDkn/view?usp=sharing
I also created another angular8 small sample project with above angular material import writing, work fine in the sample project.
but in our project, after we run the project dotnet run
we got below error, which indicate
at Object.eval (SharedModule.ts:6) //line 6
at eval (SharedModule.ts:90) //line 90
these two lines has issue.
Please see picture 5
https://drive.google.com/file/d/1m8ibzHs6whBnzKAuH000lQKVHHY-q0AD/view?usp=sharing
line 6 is import {MatDialogModule} from '#angular/material/dialog';
please see picture 6
https://drive.google.com/file/d/1i-_By1bDu4mmySiVRS13h2PhwSzUNrPD/view?usp=sharing
line 90 is export class SharedModule {}
please see picture 7
https://drive.google.com/file/d/1htQTNXZd_bcFCk4QxKn0nSRGi1jCLL6s/view?usp=sharing
currently I have not any clue why import #angular/material has that error message.
I have tested below scenario
If I completed deleted every import from #angular/material ,then project can run fine.
but if I just import a single Angular button
import {MatButtonModule} from '#angular/material/button';
then the project failed.
I created simple sample project always work fine.
I deleted node_modules folder, to reinstall npm install, project still has same error.
when I install #angular/ material npm install --save #angular/material#8, no any error show up in terminal .
just in the project,after upgrade from v7.21 to v8 then got above error.
Did you do export at NgModule in app.module.ts

How to upgrade react-leaflet from v.2.8 to v.3

I'm using react-leaflet v.2.8 in my project. I want to upgrade the react-leaflet to v.3. But how? When I write "npm i react-leaflet", it installed only react-leaflet v.2.8.
One way:
npm uninstall react-leaflet
npm install react-leaflet
Another way:
Go to your package.json, and change whatever version number react-leaflet has to the latest one that is listed on npm. It should then look like this in the package.json:
"react-leaflet": "^3.2.0"
Then run npm install react-leaflet
Keep in mind there are lots of breaking changes from version 2 to version 3, so be prepared to update your codebase.

How to make JSPM install Bower dependencies

For a while now, my client has been using some Node and Bower components to build projects. Whenever a new developer comes in, it's easy for that person to simply run
npm install
bower install
And then be ready to work.
We are working on a new project and this time we want to use JSPM instead of Bower. However, we want to leverage our existing private libraries (20+ of them) and we don't want to spend stupid amounts of time rewriting them. Plus they still need to work as regular Bower components for other projects.
So far, this worked. We used jspm-git to set the registry. However, JSPM fails in one regards: it does not install the Bower dependencies of those libraries it installed.
How would we go about that? I would love the other devs in the team to be able to check out the project and run
npm install
jspm install
And be on their way. It doesn't seem possible so far. Any set up we have forgotten? Any guidance will be greatly appreciated.
You need the jspm bower endpoint:
npm install jspm-bower-endpoint --save-dev
Then you need to register the bower endpoint with jspm:
jspm registry create bower jspm-bower-endpoint
Then you can install bower packages:
jspm install bower:angular-bootstrap-multiselect
Hope this helps :)
Just installed it successfully with jspm install npm:bootswatch, then required it in code with <require from="bootswatch/slate/bootstrap.min.css"></require>
Also posted this info on the bootswatch-dist project on github here: https://github.com/dbtek/bootswatch-dist/issues/32

Using "npm install" to install jquery-ui

I see from here https://github.com/jquery/jquery-ui that jquery-ui's latest release is 1.11.4. However, when I use "npm install jquery-ui", it's only 1.10.3. I checked this version in node_modules/jquery-ui/jquery-ui.js.
Is there any way for me to install the latest version?
jQuery-ui specifically needs to be build after installation. To avoid this, use npm install jquery-ui-dist
T J gave the right answer, but it is a bit short / too generic.
The GitHub project is at https://github.com/jquery/jquery-ui/
So the real command would be npm install github:jquery/jquery-ui (you can even skip github: as npm defaults to it).
But this would bring you the latest, unstable version (around 1.12 at time of writing), and it didn't even work when I tried.
So it is better to fetch a tagged version:
npm install github:jquery/jquery-ui#1.11.4
Generic note: AFAIK, if the project hasn't a package.json file, this kind of install can still fail.
Here is the current latest version (1.11.4), same package that bower is using, including all themes.
npm install github:components/jqueryui#1.11.4
You can install it like
npm install github:mygithubuser/myproject
as mentioned in the install documentation

Bower - Get only files needed (not entire Repo)

I am trying to use Bower to install jquery.
The frustrating problem I have been running into is that bower downloads the entire repro. I was hoping to tell bower to install a certain version of jquery and have only those files downloaded.
I did try the suggestion here with no luck. The entire repo is still downloaded even after clearing the bower cache
I would rather have something else manage which files to download than me manually specifying the file names in bower.json
bower.json in the repo : https://github.com/jquery/jquery/blob/master/bower.json
Thank you
I think you didn't unterstand the meening of bower:
Bower is handling you dependencys, so if you do a:
bower install jquery
it should download all files.
Now to you question:
you have following options:
declare wich file you want to download:
bower install http://code.jquery.com/jquery-2.1.0.min.js
but remember:
this file cant be updated easily
search for a js only package:
expample with bootstrap:
bower install bootstrap-css-only
but remember:
these packages sometimes are not up to date
use bower-installer (recommended):
install the bower-installer:
npm install bower-installer --global
and now follow the tutorial:
bower-installer github
sorry for my bad english :-)

Resources