vue1——vue引入方法,npm本地安装
博客地址 :https://www.cnblogs.com/sandraryan/
Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架。Vue 只关注视图层, 采用自底向上增量开发的设计。
vue使用方法:
1. 官网下载直接引入js文件
2. cdn <script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>(我用的是这个)
3. npm
要使用npm,首先应该去node官网下载node,下载好的node会包含npm工具,可以通过在终端输入node -v /npm -v查看node/npm是否安装成功
npm i npm -g 升级/安装npm
然后,npm i vue (i是install的缩写)
检测vue是否下载成功,vue -V(注意:大写V)
全局安装vue-cli npm install --global vue-cli (global简写g)
使用webpack打包工具生成文件目录(初始化vue项目) vue init webpack 文件夹
进入生成的文件(命令cd 文件夹名),运行vue页面: npm run dev
运行成功终端会返回一个网址,一般来说端口号是8080,在浏览器打开,就是你的vue项目惹
补充: NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题
命令行界面(英语:command-line interface,缩写:CLI)
webpack是一个开源的前端打包工具。Webpack 提供了前端开发缺乏的模块化开发方式,将各种静态资源视为模块,并从它生成优化过的代码。要使用Webpack 前须先安装Node.js, 在vue使用webpack会自动生成目录
如果只是自己写demo我一般用cdn引入,但是要进行大型项目开发,一般都用npm
安装路由
vue在安装的时候选yes,可以下载路由,如果选了no,后期也可以自己安装(配置本篇不写QAQ)
npm i vue-router --save
安装vue-x
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式
一般都只在当前项目下安装vuex
npm i vuex --save
tha‘t all~~~~
vue1——vue引入方法,npm本地安装的更多相关文章
- 关于npm本地安装模块包(node_modules),安装不了的问题
单独测试的时候,发现安装不了node_modules包 缺少package.json,无法安装. 分为以下两步: 1.npm init -y 2.npm i -D vue 或 yarn add vue
- Vue引入非npm的js库
Vue引入非npm的js库 Vue项目有时候需要一些没有export的js库,不能通过import引入,那么使用方法如下 1.可以在index.html页面使用script标签引入,当然也可以使用cd ...
- 16、vue引入echarts,划中国地图
vue引入echarts npm install echarts --save main.js引入 import echarts from 'echarts' Vue.prototype.$echar ...
- Node.js npm基础安装配置&创建第一个VUE项目
使用之前,我们先来明白这几个东西是用来干什么的. node.js: 一种javascript的运行环境,能够使得javascript脱离浏览器运行.Node.js的出现,使得前后端使用同一种语言,统一 ...
- nodejs npm install全局安装和本地安装的区别
npm的包安装分为本地安装(local).全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已,比如:代码如下:复制代码npm install # 本地安装npm install - ...
- [转] npm install 本地安装与全局安装的区别
npm的包安装分为本地安装(local).全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已,比如 npm install grunt # 本地安装 npm install -g ...
- vue 项目 使用sass,node-sass 安装方法及cnpm下如何安装node sass
内容为转载,方便用时查阅,原文地址: https://www.cnblogs.com/crazycode2/p/6535105.html 1,使用save会在package.json中自动添加. 1 ...
- npm install —— 从一个简单例子,看本地安装与全局安装的区别
npm的包安装分为本地安装(local).全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已,比如 npm install grunt # 本地安装 npm install -g ...
- 单页面vue引入百度统计的使用方法!
最近组长安排着做一个项目,h5的应用下载项目,想着做起来还是比较容易,可是看到提出的需求,我就有点懵逼了!需要对应用的下载进行统计!!!我当时就想着我前端怎么对页面点击按钮就行数据统计啊!我以前的项目 ...
随机推荐
- java项目小手册
集合了一些常用的小片段 1. 字符串有整型的相互转换 Java代码 String a = String.valueOf(2); //integer to numeric string int i = ...
- Leetcode78. Subsets子集
给定一组不含重复元素的整数数组 nums,返回该数组所有可能的子集(幂集). 说明:解集不能包含重复的子集. 示例: 输入: nums = [1,2,3] 输出: [ [3], [1], [2 ...
- 强强联合 阿里云 RDS for SQL Server 与 金蝶 K/3 WISE 产品实现兼容适配
强强联合 阿里云 RDS for SQL Server 与 金蝶 K/3 WISE 产品实现兼容适配,原K/3 WISE用户通过简单配置就可以无缝搭配RDS SQL Server使用,不需再费时费力自 ...
- 【python之路14】发送邮件实例
1.发邮件的代码 from email.mime.text import MIMEText from email.utils import formataddr import smtplib msg ...
- Thinkphp js、css压缩类minify
说明:Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能.它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和注释,进行gzip压缩,并且会设置浏 ...
- 机器学习之决策树(ID3)算法与Python实现
机器学习之决策树(ID3)算法与Python实现 机器学习中,决策树是一个预测模型:他代表的是对象属性与对象值之间的一种映射关系.树中每个节点表示某个对象,而每个分叉路径则代表的某个可能的属性值,而每 ...
- 【JZOJ3623】【SDOI2014】数表(table) 树状数组+离线+莫比乌斯反演
题面 100 \[ Ans=\sum_{i=1}^n\sum_{j=1}^mg(gcd(i,j)) \] 其中, \[ g(d)=\sum_{i|d}i \] 我们注意到\(gcd(i,j)\)最多有 ...
- javascript里的eval总结
JavaScript eval() 函数 1.定义和用法 eval() 函数计算 JavaScript 字符串,并把它作为脚本代码来执行. 如果参数是一个表达式,eval() 函数将执行表达式.如果参 ...
- Webpack ERROR in Path must be a string. Received undefined
在学习webpack过程中,我遇到的下面这个问题及解决方法. 问题如下: node版本如下截图: package.json文件截图: webpack.config.js文件截图: 然后,我运行项目,报 ...
- python中函数和方法区别,以及如何给python类动态绑定方法和属性(涉及types.MethodType()和__slots__)
网上有很多同义但不同方式的说法,下面的这个说法比较让你容易理解和接受 与类和实例无绑定关系的function都属于函数(function): 与类和实例有绑定关系的function都属于方法(meth ...