Using Node package in NativeScript app - javascript

I am learning NativeScript. For example, I would like to include this Guid generator package in my NativeScript app. My question is, how? I look at the directory structure generated by the command-line tool and I see the following relevant pieces:
node_modules
app
tns_modules
package.json
package.json
Do I add node-uuid to the ./package.json or the ./app/package.json? How do I reference it in my app then? For example, if I want to use uuid from the app.js file, what does that look like? I'm a little confused because of the package structure of NativeScript and how things actually get loaded at runtime.
Thanks

Run npm install from the root of your {N} app.
npm install --save node-uuid
The dependency will be added to the outer package.json.
And then in your app.js file, just use it like usual.
var uuid = require('node-uuid');
When you run tns run <platform> or tns build <platform>, the modules inside node_modules/ will be copied to folder under platforms/, take Android for example, it will be at platforms/android/assets/app/tns_modules/node-uuid. The building process is completed under platforms/ directory.

Related

Making a local Javascript library - Do I have to publish an NPM package?

I have some javascript utility functions that I would like to be able put in a central folder and reference from different projects.
It seems I cant import functions from outside the src file in of my project.
Do I have to publish an NPM package?
Do I have to duplicate the code in each project?
Am using javascript/node + vscode.
thanks
To create a local (unpublished) library package
Create a 'my-library' folder. Include source code, exporting any desired functions. Folder must include the 'package.json' file generated by npm init
cd into the folder of the project that needs to use your library. Run npm install --save local/path/to/my-library.
The --save will add the package to your dependencies in the project's package.json file, as it does with 3rd party published packages. It will also add a copy of the source code to the node modules folder of the project, as always.
import/require the package as you would normally, from any project. For example
import { myFunction } from "my-library"
You can use Lerna for dividing projects into multiple packages locally. It uses the same node_modules and can be deployed to NPM anytime.

'vue' is not recognized as an internal or external command

everything was installed correctly. but whenever I try to create project, it says "'vue' is not recognized as an internal or external command". I installed and re-installed but didn't work. npm was also added to environmental variable path.
C:\Users\touha\Desktop>npm list -g --depth=0
C:\Users\touha\.npm-packages
`-- #vue/cli#3.8.2
C:\Users\touha\Desktop>vue ui
'vue' is not recognized as an internal or external command,
operable program or batch file.
C:\Users\touha\Desktop>
Locate vue.cmd and add its location to your PATH
It is added to package manager(npm or yarn) installation. So you may find it at following locations
YARN
C:\Users{YourAccount}\AppData\Local\Yarn\bin
NPM
C:\Users{YourAccount}\AppData\Roaming\npm
just open PowerShell and run: npm install -g #vue/cli
Addition: If setting the path variable and reinstalling #vue/cli does not work, using the node.js command prompt instead might solve the issue.
It seems vue isn't been installed globally for some reasons.
This is the step I followed to solve mine:
Firstly, create your desired project folder (say "Vue Project"). This is where you want to create a vue project.
Then create a "node_modules" folder in the Vue Project folder
Then go to your system npm folder C:\Users{YourAccount}\AppData\Roaming\npm
You will see three different "vue" files. Copy them and paste in the Vue Project Folder you created.
Go back to C:\Users{YourAccount}\AppData\Roaming\npm and enter the node_modules folder. You'll see a "#vue" folder. Copy this, and paste it in the node_modules folder you created in the Vue Project Folder.
You can now head back to the CLI and create your project using "vue create my-vue-project" where my-vue-project is your desired vue project name.
You can try this way it worked for me
go to the location of your yarn or npm mine is C:\Users\TED\AppData\Local\Yarn\bin for Yarn
C:\Users\TED\AppData\Local\Npm\bin for Npm users
TED will be replaced by your user name
then copy and add it to your system environment variable
Note in case you don't find AppData make sure you have view hidden file checked
I am using Yarn to install #vue/cli.
The way I solve it is via the following steps
Locate your global installed vue.cmd location
Add the vue.cmd directory into System variable Env. For myself, the path is C:\Users{MyAccount}\AppData\Local\Yarn\.bin
what worked for me:
In a powershell :
npm install vue
npm install -g #vue/cli
C:\Users\{USER}\AppData\Roaming\npm\vue.cmd create {NAME}
if you got this error most probably chance package not installed completely
check-in C:\Users\dev\AppData\Roaming\npm
if you had not found the package under this folder then re-run your command
Run command prompt as administrator
Run setx /M path "%path%;%appdata%\npm
Restart the command prompt
Now create the Vue project

Configuring Express Generator to use Pug instead of Jade

I installed Express Generator for Node.js but when I created an example app, I noticed that Jade is deprecated to Pug. I installed Pug, but I still need to tell express generator to use it each time. I've been reading about the subject and it's telling developers to just change the file names manually, but is there a way for this to work out of the box? How do I do that?
Express defaults to Jade but if you wish to pug as a template engine instead of using Jade.
You must type
express --view=pug myapp
This will create a new application called "myapp" using pug by default.
For a more in dept explanation type
express -h
this will show you the available commands, one of the commands is -v
--view add view support
Reference: https://expressjs.com/en/starter/generator.html
I made two mistakes trying to follow the above docs. It's because I'm still getting used to installing packages locally and globally.
2 Mistakes:
I. npx express-generator
This installed it locally, making express unavailable in the command line terminal.
When I installed it globally, I had access.
II. starting in a folder on Atom, an IDE. Express-generator creates a folder for you, so you start in the terminal outside of a folder, such as your desktop.
9 Steps to solution:
Use the terminal in your desktop directory, not an IDE.
Do not create a folder or any file.
Install express-generator globally, not locally.
sudo npm express-generator
Verify you have access by: express -h
Type: express --view=pug my app
Change directories to myapp folder on desktop
npm install
DEBUG=myapp:* npm start
open your browser to http://127.0.0.1:3000/
I think this issue come when npx express-generator is used alone (for those who have node versions above Node.js 8.2.0).
for node versions 8.2.0 or above,
Navigate to the directory where you want to create the app
npx express-generator --view=pug myapp
This will create a myapp folder in the directory with required .pug
files instead of .jade files
for earlier node versions you can find the required steps here express
application generator documentation
npx express-generator --view=pug install.
this should do the trick

Using stellar-lib api with Meteor

this is probably a silly question but am new to Meteor and struggling a bit. I want to build a stellar app that tweets when you get stellar. There is a nice Javascript API stellar-lib that works on node, but im unsure how to access the modules in Meteor...
I'm also building an app with Meteor and stellar-lib and have found two options:
1) You can manually copy over the built stellar-lib.js or stellar-lib-min.js from the build/ directory from either the github repo or the node_modules folder you installed it to when you ran the npm install command.
If you do this, you will have to copy the .js file to client/compatibility, otherwise stellar-lib will not work (note: this means you can only use Stellar on the client).
2) If you need it on the server, you can also have browserify wrap stellar-lib for you, then copy the output to lib/ in your Meteor app's root directory. I did this in my repo here with gulp.
Here's a short explanation to how 2) works:
.gulp is where I'll install my NPM modules where they will be ignored by the Meteor build environment (because the folder is hidden).
In deps.js, I require the modules I would want to use in my Meteor app as I would if I was using them in a traditional node.js app. package.json defines the modules I'll install with NPM and the gulpfile.js describes a build task that will resolve my require statements and output a single deps.js file that includes my dependencies to my Meteor app's lib/ folder.

Yo generator subgenerator not available. When doing an NPM install it doesn't pull all the code down

I'm working on creating an Yo generator to generate hapijs modules. I've published this to NPM and when I create a new project and do an npm install generator-hapijs, it doesn't pull all the code down into my node_modules/generator-hapijs directory and therefore my subgenerator is not available when doing a yo --help. Why not and how can I fix this?
Here's my code: https://github.com/toymachiner62/generator-hapijs
Here's what's available in my node_modules/generator-hapijs folder when installing this package in a new project:
-/project
--/node_modules
---/generator-hapijs
----/app
----/node_modules
----package.json
----README.md
It had nothing to do with yeoman and yo, but rather had to do with the fact that I had a files array in my package.json and it only contained app so when installing it only installed files from the /app folder.
I just removed the files array from my package.json file.

Categories

Resources