vue.js常见的安装方式有哪些

  介绍

小编给大家分享一下vue.js常见的安装方式有哪些,希望大家阅读完这篇文章后大所收获、下面让我们一起去探讨吧!

vue.js常见的有3种安装方式:1,在vue.js官网上直接下载vue.js文件,并在html中通过脚本标签中引用;2、使用CDN方法,在html的脚本标签中直接使用CDN链接进行引用;3、使用NPM工具进行安装。

Vue。js(读音/vju吗?/,类似于视图)是一个构建数据驱动的web界面的渐进式框架.Vue。js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。它不仅易于上,手还便于与第三方库或既有项目整合。

下面介绍三种Vue。js的安装方法:

独立版本

我们可以在Vue.js的官网上直接下载Vue.js,并在html中通过<代码> & lt; script> & lt;脚本src=https://www.yisu.com/vue.js> 开发环境不要使用最小压缩版,不然会没有错误提示和警告!(页面中直接使用)

使用vue多页面开发:

引入vue。js
创建一个vue根实例新vue({选项})

<强>使用cdn方法

BootCDN(国内):https://cdn.bootcss.com/vue/2.2.2/vue.min.js(国内不稳定)

unpkg: https://unpkg.com/vue/dist/vue.js,会保持和npm发布的最新的版本一致。(推荐使用)

cdnjs: https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js,如(https://www.yisu.com/zixun/<代码> & lt;脚本src=" https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js "> )

<强> npm方法(推荐使用)

在用Vue.js构建大型应用的时候推荐使用npm安装方法,npm能很好的和诸如<代码> Webpack> Browserify 模块打包器配合使用.Vue。js也提供配套工具来开发单文件组件。

首先,先列出我们接下来需要的东西:

<李>

节点。js环境(npm包管理器)

<李>

vue-cli脚手架构建工具

<李>

cnpm npm的淘宝镜像

<>强安装node . js

从节点。js官网下载并安装节点,安装过程很简单,一直点下一步就好了,安装完之后,我们通过打开命令行工具(win + R)、输入节点- v命令,查看节点的版本,若出现相应的版本号,则说明你安装成功了。

 vue。js常见的安装方式有哪些

npm包管理器,是集成在节点中的,所以安装了节点也就有了npm,直接输入npm - v命令,显示npm的版本信息。

 vue。js常见的安装方式有哪些

到目前为止,节点的环境已经安装完成,npm包管理器也有了,由于有些npm资源被屏蔽或者是国外资源的原因,经常会导致npm安装依赖包的时候失败,所以我们还需要npm的国内镜像——cnpm。

<>强安装cnpm

在命令行中输入,<代码> npm安装- g cnpm——注册表=http://registry.npm.taobao.org ,然后等待,没报错表示安装成功,(我的已经安装过了,显示更新成功的信息),如下图:

 vue。js常见的安装方式有哪些

完成之后,我们就可以用cnpm代替npm来安装依赖包了。如果想进一步了解cnpm的,查看淘宝npm镜像官网。

<>强安装vue-cli脚手架构建工具(必须在全局中进行安装)

在命令行中运行命令<代码> npm安装- g vue-cli> <李>

是否安装成功:vue - v

<李>

webpack的版本查询:webpack - v

通过以上三部,我们需要准备的环境和工具都准备好了,接下来就开始使用vue-cli来构建项目。
首先我们要选择存放项目的位置,然后再用命令行cd到项目的目录中,在这里,我选择在c盘下创建新的目录(NodeTest目录),用cd将目录切到该目录下,如下图:

 vue。js常见的安装方式有哪些

在NodeTest目录下,在命令行中运行命令vue init <代码> webpack firstApp> vue.js常见的安装方式有哪些