vue2.0---搭建vue的开发环境
vue2.0---搭建vue的开发环境
- 一、NPM 使用介绍
- 测试node是否安装完成
- cnpm介绍
- 安装cnpm
- 如果检测失败出现：***权限问题
- Powershell 脚本运行的几种权限：
- 二、命令行工具（cli）--脚手架
- 三、安装vue
- 安装
- 四、创建一个vue项目
- 1. 简单版本创建过程
- 2. vue3.0安装
- 3. 完整版本创建
一、NPM 使用介绍
- NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：
- （1）允许用户从NPM服务器下载别人编写的第三方包到本地使用。
- （2）允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
- （3）允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
测试node是否安装完成
- 由于新版的nodejs已经集成了npm，所以之前npm也一并安装好了。同样可以通过输入 “npm -v” 来测试是否成功安装。
cnpm介绍
- cnpm是中国npm镜像的客户端
安装cnpm
- npm install -g cnpm --registry=https://registry.npm.taobao.org
- 安装完毕后在命令行输入以下命令测试是否安装成功，正确会出现版本号
- npm -v
如果检测失败出现：***权限问题
- 解决办法：修改电脑权限–搜索PowerShell–以管理员方式运行–输入命令Set-ExecutionPolicy unrestricted
Powershell 脚本运行的几种权限：
- （1）Restricted: 默认设置，不允许任何脚本运行
- （2）AllSigned: 只能运行经过数字证书签名的脚本
- （3）RemoteSigned: 运行本地脚本不需要数字签名，但是运行从网络上下载的脚本必须要有数字签名
- （4）Unrestricted: 允许所有的脚本运行, 但是在运行前会提示是否进行操作
- （5）Bypass: 允许所有的脚本运行, 没有任何的提示和警告。
- 查看当前 PowerShell 的环境配置：
- Get-ExecutionPolicy
二、命令行工具（cli）–脚手架
- Vue 提供了一个官方的 CLI，为单页面应用 (SPA) 快速搭建繁杂的脚手架。
三、安装vue
- NPM 方法
- 由于 npm 安装速度慢，我们使用了淘宝的镜像及其命令 cnpm。
安装
- cnpm install -g @vue/cli（最新安装）
- cnpm i -g @vue-cli@3.0.0(指定版本安装 )
- yarn global add @vue/cli（更快）
- 安装成功输入vue-V会出现对应版本号
- 执行卸载
- cnpm uninstall -g @vue/cli
四、创建一个vue项目
- 简单版本创建
- vue init webpack-simple 项目名称（名称不要是中文）
- 完整版本创建
- vue init webpack 项目名称（名称不要是中文）
- vue3.0创建方式
- vue create my-project
1. 简单版本创建过程
- 解释
- （1）项目名称
- （2）项目描述
- （3）作者
- （4）开源协议
- （5）是否使用sass
- 项目创建成功–如下所示
- 右键demo-1在集成终端上打开
- 安装依赖：cnpm install
- 安装完成会出现一个node_modules的文件夹（放的就是环境依赖）
- 运行：cnpm run dev
- 发布：cnpm run build
2. vue3.0安装
- 选择一些自己的规则
- 空格就是选中或者删除
- 不缓存当前项目
- 安装完成的项目文件
- 安装依赖：cnpm install
- 运行：cnpm run serve
- 发布：cnpm run build
3. 完整版本创建
- 不装路由
- 使用npm命令
- 安装完成之后的目录
vue2.0---搭建vue的开发环境相关推荐
- VS2012+WDK8.0搭建WDF驱动开发环境
根据目前资料,如果要调试ReactOS源码,有很多工作要做:安装RosBE,下载ReactOS源码,生成VS工程,由源码生成镜像文件,等步骤:然后VS还要搭建驱动开发环境:然后由虚拟机装载运行镜像,V ...
- vs2012+wdk8.0 搭建wdf驱动开发环境
开发环境搭建: 系统:win7 x64 工具:vs2012 + WDK8.0 插件:wdfcoinstaller.msi (1)先安装vs2012,再安装wdk8.0,这样在打开vs2012时可以创建 ...
- 利用官方的vue-cli脚手架来搭建Vue集成开发环境
在利用vue-cli脚手架搭建vue集成环境之前,我们需要先安装nodejs的环境.如果在cmd中输入node --version和npm --version出现如下的版本信息,就说明安装已经成功了. ...
- vue2.0配置代理 api 开发环境、生产环境
业务场景:只需内网调用接口,不需要ngix,所以生产环境没有跨域问题不用api代理,但是本地环境有跨域问题要做代理. 实现需求:本地环境有api,生产环境没有api 以下是实现方法: 1. confi ...
- webpack搭建vue项目开发环境【文档向学习】
为何有这篇文章 各个社区已经有无数篇帖子介绍如何使用webpack搭建前端项目,但无论是出于学习webpack的目的还是为了解决工作实际需要都面临着一个现实问题,那就是版本更新.别人的帖子可能刚写好版 ...
- vue2.0搭建vue手脚架（vue-cli）
1.安装node.js 从node官网下载并安装node,安装步骤很简单,只要一路"next"就可以了. 安装完成后,打开命令行工具输入命令node -v,如下图,如果出现对应版本 ...
- 用 cooking 搭建一个简单又优雅的 Vue 项目开发环境 (入门篇)
本文适合 Vue 的初学者,以及对 webpack 不熟悉的同学阅读.前提是你要会用基本的命令行. Node 和 NPM,以及掌握 ES2015 的基础知识.本文都是在 macOS 环境下运行,要求使 ...
- [vue-cli]不用vue-cli，你自己有搭建过vue的开发环境吗？流程是什么？
[vue-cli]不用vue-cli,你自己有搭建过vue的开发环境吗?流程是什么? 基本概念 首先先了解先webpack的基本概念,webpack属于一个构建工具,主要有mode.entry.out ...
- 从零开始搭建webpack的vue生产/开发环境
一.初始化项目 在命令行中敲入如下命令: mkdir Webpack-Vue && cd Webpack-Vue && npm init -y 然后你就可以在你的当前路 ...
最新文章
- 利用Query判断checkbox是否选中的写法！(
- 数据库自增主键可能产生的问题
- hadoop spark端口整理
- boost::mpl::aux::msvc_is_class相关用法的测试程序
- 编程获取linuxservercpu、内存和磁盘使用
- 静态变数和非静态变数_统计资料：了解变数
- php状态,PHP 状态模式 - 304158的个人空间 - OSCHINA - 中文开源技术交流社区
- vue 内的 对象 获取 键值对_vue.js - vue 登录存localStorage的方法
- 【组件】大数据框架安装功能来划分
- 三国群雄传ol服务器 修改,三国群英传OL DATA.PAK相关修改
- ||分享一些百度云下载不限速神器||
- 100%可用的总裁主题授权版 WordPress付费资源素材下载主题
- 计算机协会报名范文,2020年大学计算机协会活动计划书范文
- Chapter 5 Eigenvalues and Eigenvectors
- vulnhub Photographer: 1
- 聚焦“芯”产业，搭建“芯”桥梁——清微智能出席AIIA2020年度AI芯片交流会
- java utill scanner_(转)java.util.Scanner应用详解
- 【ubuntu】——安装wps
- android设置悬浮窗口的透明度,Android TransparentActivity 悬浮窗兼容方案
- 【财务_会计1_1】会计概念和目标