VUE环境项目搭建以及简单的运行例子
1。打开cmd命令窗口,node-v和npm-v可以查看相应的安装版本信息。

2。使用一下命令全局安装vue-cli。
1)npm install -g vue-cli
2)如果使用淘宝镜像,则是:npm install -g cnpm --registry=https://registry.npm.taobao.org

3.使用命令 vue init webpack vue-xxx 搭建vue项目, “vue-xxx” 是你的项目名称。
4.配置需要安装的vue环境(此处图片为复制粘贴):

5.目录结构:src中的就是我们要用到的。公共文件,单页vue文件等。

6.运行项目:npm run dev
7.压缩项目:npm run build(压缩之后的文件可以打包apk等等)
8.路由里边的引入:
1)设置import和下边的path引入。从login开始的文件都写在components之中。
2)此处的“mode:"history”。参考文档:https://router.vuejs.org/zh/guide/essentials/history-mode.html

3)还有另一种写法,这个更为简洁化,也更明确:

9.如果是从线上分值拉下来的,那么此时就需要安装依赖,安装完依赖之后再借此运行项目(npm run dev),打压缩包(npm run build):
npm install

VUE环境项目搭建以及简单的运行例子的更多相关文章
- Vue的项目搭建及请求生命周期
目录 Vue的项目搭建及请求生命周期 Vue-CLI的项目搭建 环境搭建 项目创建 pycharm运行Vue项目 Vue项目的大体结构 Vue的请求生命周期 两个小用法 Vue的项目搭建及请求生命周期 ...
- Python+selenium测试环境成功搭建,简单控制浏览器(firefox)接下来,继续学习其他浏览器上的测试环境搭建;学习Python语言,利用Python语言来写测试用例。加油!!!
Python+selenium测试环境成功搭建,简单控制浏览器(firefox)接下来,继续学习其他浏览器上的测试环境搭建:学习Python语言,利用Python语言来写测试用例.加油!!!
- vue开发(开发环境+项目搭建)
Vue.js是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vu ...
- (转)windows环境vue+webpack项目搭建
首先,vue.js是一种前端框架,一般利用vue创建项目是要搭配webpack项目构建工具的,而webpack在执行打包压缩的时候是依赖node.js的环境的,所以,要进行vue项目的开发,我们首先要 ...
- node+mysql+vue+express项目搭建
第一步:项目搭建之前首先需要安装node环境和MySQL数据库. 在已经完成上述的条件下开始进行以下操作: npm install @vue/cli -g (-g 代表全局安装) 初始化项目 v ...
- VUE 脚手架项目搭建
1. 概述 1.1 说明 vue-cli是一个官方发布vue.js项目脚手架,使用vue-cli可以快速创建vue项目.GitHub地址是:https://github.com/vuejs/vue-c ...
- Vue之项目搭建
一.Vue自动化工具的安装 nvm:nodejs 版本管理工具. 也就是说:一个 nvm 可以管理很多 node 版本和 npm 版本. nodejs:在项目开发时的所需要的代码库 npm:nodej ...
- Spring boot项目搭建及简单实例
Spring boot项目搭建 Spring Boot 概述 Build Anything with Spring Boot:Spring Boot is the starting point for ...
- vue 环境的搭建及初始化项目
其实超级简单,虽然网上很多,但是我顺便记录下相当于做笔记吧 1nodejs 的安装, 在node官网下载,点击安装,安装的时候最好选择路径在d盘 2设置环境变量 我的电脑-->属性-->系 ...
随机推荐
- 小程序组件中有bindinput监听报异常
真机上有问题,ide上是没问题的, 组件有处理函数,结果异常说页面没有处理函数,加上处理函数后就不报异常了.
- servlet(2)servlet过滤器
1.servlet过滤器 用于动态的拦截servlet请求或响应,以变更或使用其中的信息. (1)过滤器和servlet是多对多的关系,即一个过滤器可以用于一个或多个servlet,多个过滤器也可以用 ...
- YApi二次开发环境部署
YApi 是去哪儿网大前端技术中心开源的一个可视化的接口管理平台.下面是在CentOS7下搭建二次开发环境步骤. 1 安装MongoDB 具体安装参考CentOS7安装MongoDB 2 安装Node ...
- DNS 地址
腾讯DNS:119.29.29.29百度DNS: 180.76.76.76 阿里DNS:223.5.5.5 223.6.6.6 成都电信: 61.139.2.69
- luogu P1723 高手过愚人节
打算下周讲课就讲Manacher了 所以百度了一下相关题目,发现了一道千古好题 这道题没想到是一道模板题,模板中的模板 简要说一下思路,我们先复制一遍模板(甚至变量都不用改 然后唯一的区别就是要求的是 ...
- BZOJ1112[POI2008]砖块Klo——非旋转treap
题目描述 N柱砖,希望有连续K柱的高度是一样的. 你可以选择以下两个动作 1:从某柱砖的顶端拿一块砖出来,丢掉不要了. 2:从仓库中拿出一块砖,放到另一柱.仓库无限大. 现在希望用最小次数的动作完成任 ...
- react native 左边固定,右边横向滑动左右自适应高度
要实现的效果 https://zuobaiquan.github.io/blogImg/201903/01.gif
- centos7服务器配置nuxt部署环境
一.安装node(默认安装在根目录下) 1.首先安装wget yum install -y wget 2.下载最新nodejs安装包 wget https://nodejs.org/dist/v10. ...
- iis7设置ftp
目前是所有网站一个域下.ftp登录后可看到所有网站,目前想ftp一个网站,查看了下服务器,貌似只有serv-u这么个东西,还不能再创建第二个域.不得其解.百度发现两篇文章正好: http://blog ...
- (N叉树 DFS 递归 BFS) leetcode 559. Maximum Depth of N-ary Tree
Given a n-ary tree, find its maximum depth. The maximum depth is the number of nodes along the longe ...