VUE项目学习（一）：搭建VUE前端项目

1、安装node.js环境

（1）下载node.js，下载地址为：https://nodejs.org/en/
（2）按照默认选项安装node，检查安装版本

（3）配置下载镜像，镜像地址为：http://npm.taobao.org/，安装成功后，可以直接使用cnpm代替npm命令

npm install -g cnpm –registry=https://registry.npm.taobao.org

检查cnpm是否安装成功

2、搭建vue项目

（1）全局安装VUE脚手架vue-cli，执行命令为：

npm install --global vue-cli

安装成功的界面为：

（2）选择项目目录，创建一个基于 webpack 模板的新VUE项目，项目下载命令为：

vue init webpack demo

在项目配置界面，可以参考下图说明：

项目下载成功后如下图所示：

（3）启动项目，进入项目所在根目录，运行项目启动命令：

npm run dev

项目启动成功后，界面如下图：

在浏览器地址栏输入：http://localhost:8080，出现下图界面，说明初始项目搭建成功，可以进行个性化前端开发了！

VUE项目学习（一）：搭建VUE前端项目相关推荐

Vue入门之Web端CURD前端项目示例
Vue入门之Web端CURD前端项目示例随着vue.js越来越火,很多不太懂前端的小伙伴想要入坑.而入坑最好的办法就是上手实际操作,因此本文将重点放在实际操作上,对理论不做过多解释,不明白的地方小伙 ...
Vue.js学习系列七——Vue服务器渲染Nuxt学习
我又回来啦~这次我们来学习Vue的服务器渲染SSR. 关于SSR的文章网上很多,一开始看得我云里雾里.然后去Vue.js 服务器渲染指南和nuxt官网看了看,发现文章大多都是搬运官网的内容,真正讲的清 ...
用vue+webpack搭建的前端项目结构
上个项目第一次用到vue+webpack,也是我第一次尝试自动化.模块化的开发方式,总的来说就是结构太烂,开发体验差,效率低,难维护.细数的罪状有如下几条没有servies层,全部ajax接口都和逻 ...
「Vue实战」武装你的前端项目
1. 接口模块处理 1.1 axios二次封装很基础的部分,已封装好的请跳过.这里的封装是依据 JWT import axios from 'axios'import router from '.. ...
如何搭建vue项目，完整搭建vue项目
完整开源vue项目第一步npm安装首先:先从nodejs.org中下载nodejs 直到Finish完成安装. 打开控制命令行程序(CMD),检查是否正常第二步项目初始化 1.第一步:安装vue ...
2022年了你必须要学会搭建微前端项目及部署方式
一.微前端简介微前端是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用.各个前端应用可以独立运行.独立开发.独立部署. ...
nginx怎么部署php项目,nginx怎么正确部署前端项目
目的: nginx部署打包成为dist的前端项目 (学习视频分享:php视频教程) 相关知识:docker 安装与使用 docker pull nginx docker run --restart=o ...
Spring Boot项目学习之通用权限管理项目01
权限管理系统是一个十分常见的系统,在这个系统中是基于角色访问控制的,用户是通过角色与权限进行关联.换句话说,就是一个用户拥有若干个角色,每一个角色拥有若干权限,这样就可以形成一个关系模型:用户-角色- ...
idea上传项目到码云_mall前端项目的安装与部署
本文主要讲解mall前端项目mall-admin-web的在Windows和Linux环境下的安装及部署. Windows下的安装及部署下载nodejs并安装下载地址:https://nodejs ...
Halo 开源项目学习（一）：项目启动
Halo 是一个优秀的开源博客发布应用,在 GitHub 上广受好评,正好最近在练习写博客,借此记录一下学习 Halo 的过程. 项目下载从 GitHub 上拉取项目源码,Halo 从 1.4.3 ...

VUE项目学习（一）：搭建VUE前端项目

VUE项目学习（一）：搭建VUE前端项目

1、安装node.js环境

2、搭建vue项目

VUE项目学习（一）：搭建VUE前端项目相关推荐

最新文章

热门文章