Installing Framework 7 CLI - npm

I'm trying to download Framework7 CLI - I'm also not a developer that develops and opens programs through command lines
I know the install is explained fairly decent, but when it says to enter
$ npm install framework7
Where do I enter that command? I used to be able to download the files directly, but now when I do the functionality isn't there. I also watched this video on youtube but it didn't help
https://youtu.be/65hfVB49PZU
Thank you in advance...
I've asked questions on the net and nobody has gotten back to me.
$ npm install framework7
There are none I haven't gotten that far yet.

You can pass the CLI to a terminal or you can directly download the necessary files and add it to your project via this link: https://github.com/framework7io/Framework7/releases/
Just click on the Source code(zip) under the v4.4.3 release. Then move the bundle.js and bundle.css files to your project file.
In your app.html file, define the paths like this:
<link rel="stylesheet" href="path/to/framework7.bundle.min.css">
<script src="path/to/framework7.bundle.min.js"></script>
You can also look at the kitchen-sink folder, it's very helpful. Make sure you're running the folders on a server or localhost.

Related

Would it be possible to follow tutorials that use vue-cli but with CLI 3?

I have just started learning Vue.js. The author is using npm install -g vue-cli but it did not work with me because I got stuck with technical issues and I tried many solutions to fix it but I couldn't.
So I want to follow up with the author but using npm install -g #vue/cli. So Do you think I it will be easy to follow up with him? I mean are these different versions use different syntax?
The vue-cli package seems to be the old cli. The main difference between this version and Vue CLI 3 is that the webpack configuration used to be visible in the project as a build directory. To make changes to the build process you used to have to modify files within this folder. In Vue CLI 3 this has been moved to a helper that consumes a configuration file vue.config.js in the project. The structure of files has been slightly altered in this version of the CLI. Both work with Vue 2.x, so the way you write .vue files has not changed in any way.
Overall you should have little trouble following the tutorial, unless you are going to make changes to the build process. In that case, simply consult the official documentation or find a tutorial that is specifically for Vue CLI 3.

Node.JS, NPM: EJS deleted itself, installs (but doesn't install), and isn't available to Download?

About 10 minutes ago I was following an online tutorial. I shut down the local server to bring my dog inside the house, then came back to the computer to finish the tutorial.
I restarted the server and got this error:
Error: Cannot find module 'ejs'
I looked in my node_modules folder, and I don't see "ejs" anywhere. I thought ok, no biggie, just reinstall. So I typed: npm install ejs -g into the terminal.
The terminal says:
+ ejs#2.6.1
updated 1 package in 0.275s
I looked in the node_modules folder again, and the "ejs" folder is not there. I checked the package.json file, and I don't see ejs listed under dependencies. (Actually, I don't know if it was there before, I can't remember. I think Express was the only Dependency)
I went to the EJS website (http://www.embeddedjs.com/) to see if I could download it directly, and just pop in the file directly onto my computer, but all of the download links return a 404 page.
There is another link at the top of their webpage: Google Code. I'm not sure which files I should download from there. I literally started tinkering with Node.js this morning.
I'm just super confused on why this is happening or how I can fix it.
You installed it globally. You can run npm list -g to see where global libraries are installed. You won't be able to find it in local directory where package.json is located.

How do I use the `node_modules` folder that NPM generates for a simple website?

In the past I've manually downloaded vendor JS such as jQuery or RequireJS and saved them in my repo under /vendor/js. I'd like to use NPM to manage all of that for me and clean up my repo a little.
I've built a packages.json file and used npm install, but I'm not sure what the best way to use the node_modules folder that it generates is.
Should I link directly to the script files in node_modules?
<script src="/node_modules/requirejs/require.js"></script>
Or should I use some other tool (gulp?) to move the contents of node_modules somewhere else after it's installed?
This isn't a Node app, just a simple front-end website that would work on any server, e.g. a LAMP stack.

About publishing Angular 2 application

I have developed an Angular 2 application using npm, As a fresher,I don't know some ways like below.
When I publish I used npm publish so that it publish the application in npm account in the web.
So here, is there any way to publish our app in the localhost,because I don't want to use npm account and I just need to avoid node_modules folder on publishing ?
If any other way,that can be used to publish the Angular2 Application in local other than npm, let me know.I try that.
If it is not possible to publish the application without npm web account, Kindly let me know please .
Excuse mistakes,If any.Thanks in adv :)
npm publish is to make a library package available to other for free use.
That's not what you use for making a web application available. This is called deployment.
For deployment you usually execute a build step that transpiles TS to JS, and combines them into a single file to reduce the number of requests the browser needs to make in order to get all source files of your application. It may also inline component HTML and CSS. This build step can also minify and mangle to JS code to reduce the resulting file size even more.
The resulting output can just be copied to any directory that any web server is able to serve to a browser either on your local machine or at some machine of a web hosting provider.
There are different ways to build your application depending on your setup.
See for example How to deploy Angular 2 application developed in Typescript to production?
You need browserify, that's all
browsers need references to all js files to be put in the html, they don't understand node's require() method that forms modules dependencies
what browserify does is traversing the entire dependency graph of your project, recursively bundling up all the required modules starting at the given root into a single js file
install it by node package manager
npm install -g browserify
use it to bundle all needed modules staring at main.js
browserify main.js -o bundle.js
now put a single script tag into your html
<script src="bundle.js"></script>
as far as i know, node_modules contains dependencies for typescript transpilers and few others. so it will not be possible to publish an app without using node_modules.
perhaps you can try using Plnkr or jsFiddle
where you can make imports online using cdn links for node_modules and publish your app.
it will be easy compared to other alternatives.
hope this helps.

npm/bower - Basic questions(Why it requires for just AngularJS then?)

I read about npm and bower, differences, usage, how it works, purpose as well. All explanation says that to work in NodeJs. But when I searched for AngularJS2, the tutorial says use npm. I have some basic questions based upon the understanding that npm basically for dependency management or packages to be installed.
How my Java/Eclipse workspace knows that npm installed the particular JS library/file, what path should be given in the html/web page for including those files/libraries?
If I move the web application to production, how will the server gets those dependent libraries? Even if server gets it, it might be installed in different folder. Basically how it can be managed with a web applications in different environments for just AngularJS app?
Can anyone please help me to have better understanding?
Finally found the answer. NPM is node package manager which helps basically to download the dependencies (almost like maven, gradle in java).
npm software needs to be installed in developer's machine.
Add the required dependencies in the package.json in the root folder of AngularJS application.
Open the DOS command line and navigate to project root folder(workspace/project in eclipse), then type npm install which will download all the dependencies mentioned in the package.json to a folder called npm_modules inside project folder.
The other and important advantage is npm can be used to install browser agent as well. So npm start command will open the browser and will load the application automatically in browser. Developer does not need to be aware about NodeJs. One more benefit of using this approach is the browser will get refreshed automatically when any update in the JS file gets saved.