I want a code highlighter for my ionic v2 (rc4) project. I tried prismjs .
As said in Ionic 2 Resources | Third Party Libraries , I did the following steps:
npm install prismjs --save
npm install #types/prismjs --save
then add import 'prismjs'; in my typescript file & In declarations.d.ts declare module '*'; already is there.
in html
<pre><code class="language-javascript">var data = 1;</code></pre>
but its not working. Am I missing something? Please help me.
As far as I know, the css will not get included that way.
Can you try to copy the css of the prismjs library into your assets folder and include it in your index.html?
Related
How would I import ts-topojson into an Angular2 project so I get Typescript typings? I installed the module using npm and tried to include with a simple import statement but the linter said it couldn't find 'topojson'.
import { Topojson } from 'topojson';
This is my first Angular2 project so I'm very new at this so I could possibly be missing a crucial step.
You could install the package #types/topojson with npm install #types/topojson --save-dev.
Now you can use topojson the following way within a component:
import {topology, feature, ...} from 'topojson';
Or with:
import * as t from '#types/topojson';
Try the following:
Make sure the script is loaded into your scripts in .angular-cli.json.
At the top of a file you want to use the library, add declare let Topojson: any;.
Now you can use Topojson without the TS compiler yelling at you, because it will be implied that it's loaded as a script and made available to you during runtime.
I try to import 3rd party library synaptic.
Library is writed in java script, and i have .d.ts file.
I did:
npm install synaptic --save
npm install #types/synaptic --save
import * as synaptic from 'synaptic' in my component
And i still get:
GET http://localhost:3000/synaptic 404 (Not Found)"
Can you help me?
When angular compiles the it won't keep the traditional JS routes. After your import you should be able to access the 3rd parties features in the component.
Try syanptic : Syanptic
and then do whatever you want with this.syanptic
I installed plugin for Intellij-Idea and it doesn`t work. Why can it be? As you can see the require word doesn`t become yellow.
And here is my plugin installed:
Please make sure to enable Node.js Core library in File | Settings | Languages & Frameworks | Node.js and NPM
I like to hover over things that are underlined to give me clues as to where to start. Your "path" and "require" are underlined. Your errors might say Unused local variable 'path' and Unresolved method or function require()
You might not have installed node in the current project. If you don't have node installed, try:
npm init to create a package.json file.
IntelliJ will walk you through creating the file. You can just press enter all the way through if you want and edit it later.
npm install express --save (replace express with whatever library you are trying to use) to save library in the dependencies list
Installing express
How can I fix WebStorm warning “Unresolved function or method” for “require”
I just want to use it, I don't care about autocomplete and all the sugar..
In package.json
"module-x": "https://github.com/somerepo/module-x"
I then try to use it in my app.component.ts
import "module-x";
and it cannot be found in the project.
Angular 2 takes JS and TS modules just fine. It will have issues with angular 1 modules however.
My guess is that your module issues are that you never ran "npm install -s" so although the package json still has it, the actual module files were never installed/downloaded.
Do "npm install -s" in project folder
and then...
import {* or feature name} from "module_x";
I am using Angular2 with Nodejs. I have a list of employees each contains employee name, address, rank etc. I want to show information when user hovers mouse on the employee name. For that I am trying using semantic-ui with angular2 but I can't find any example other than (below link) which isn't descriptive.
https://github.com/vladotesanovic/ngSemantic
Nodejs:
npm install ng-semantic --save
npm install jquery --save
Index.html
<link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.2.2/semantic.min.css">
TestSemantic.ts
import {NgSemanticModule} from 'ng-semantic';
TestSemantic.html
<sm-button class="icon" sm-popup="Add users to your feed"><i class="add icon"></i></sm-button>
First it shows me 2 semantic errors which are:
node_modules/ng-semantic/ng-semantic/input/input.d.ts(2,29), error TS2307: Cannot find module '#angular/forms'.
node_modules/ng-semantic/ng-semantic/search/search.d.ts(2,29): error TS2307: Cannot find module '#angular/forms'.
Only button is showing on TestSemantic.html but there is no pop-up displays
Note sure if this is still relevant, but did you install angular's forms module? ngSemantic depends on it as it extends form controls.
So check in package.json and node_modules if you have #angular/forms.
Based on the code in ngSemantic it should install #angular/forms automatically but it's worth checking.
If you remove temporarily the ngSemantic import but instead use
import #angular/forms just to test that the import work at least for your code (apart for ngSemantic).
I note also that the error is in a d.ts file which is a typing definition file.
If you use webpack you should be able to recompile the bundled js from the dependencies inside node_modules
I am using ngSemantic with angular 2 with no problem.