Vue安装及项目搭建

1.vue安装

1.1、直接<script>标签引入

官网下载地址为：https://cn.vuejs.org/v2/guide/installation.html#AMD-模块加载器

点击开发版本进行下载

1.2、使用CDN方式

*虽然还有其它方式，但是对于初学者来说以上两种方式最简单

1.3、NPM方式

打开控制台，输入命令

npm install vue

这样在你的本地就会出现一个名为node_modules的文件夹里面就是vue的项目文件

那么问题来了，安装好了vue怎么进行项目搭建呢？我们就要用到下面的

命令行工具CLI

在控制台中输入如下命令

# 全局安装 vue-cli
$ npm install --global vue-cli
# 创建一个基于 webpack 模板的新项目（可选安装目录）
$ vue init webpack my-project#运行完上面命令会进行一些简单的设置可参照http://www.runoob.com/vue2/vue-install.html
# 安装依赖，进入项目安装并运行
$ cd my-project
$ npm install
$ npm run dev

然后控制台会弹出，表示运行项目成功

DONE  Compiled successfully in 4541ms

 I  Your application is running here: http://localhost:8080

至此vue简单的安装及创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目就完成了～～～

时间： 2024-11-04 17:25:44

Vue安装及项目搭建的相关文章

Win10中Vue.js的安装和项目搭建

一. 提前准备工作 1.Node.js环境 2.Windows10 3.npm(前端包管理工具) 4.webpack(前端资源加载/打包工具) 二. 开始安装 1..下载并安装Node.js 下载地址:https://nodejs.org/en/download/ 2.在cmd中查看node.js是否安装成功,以及是否安装npm 3.由于npm安装资源时速度慢,推荐使用淘宝的镜像及其命令cnpm,安装使用介绍参照:使用淘宝NPM镜像. #查看版本 npm -v #升级npm cnpm insta

vuejs学习——vue+vuex+vue-router项目搭建(一)

前言 快年底了却有新公司邀请了我,所以打算把上家公司的学到一下技术做一些总结和分享. 现在vuejs都2.0了,我相信也有很多朋友和我一样实际项目还是选择vue1.0的或者给新手一些参考,不管在选择哪个版本的时候,希望你都熟读了vue+vuex+vue-router的官方文档.下面我们就开始吧. Vue搭建 这里我假设我们的电脑都安装了nodejs,那么我现在开始吧. 我们先新建一个文件(VueProject),通过命令行的方式进入这个文件夹,现在假设我们进入了VueProject文件夹,接下来

vue多页面项目搭建(vue-cli 4.0)

1.创建vue项目 cmd命令执行 vue create app (app 自定义的项目名) 一般都会选择后者,自己配置一下自己需要的选项(空格为选中) 这是我个人需要的一些选项,路由Router.状态管理Vuex.CSS处理器等(可以根据自己需要进行选择) 这里选择yes(Y) 我这里选用sass 打开ESLint和常规的一些 静静等待安装完成就可以了! 2.运行项目并配置多页面 cd app yarn serve /npm run serve 一般生成的都是8080端口的,由于本地已经在跑一

VUE 安装及项目创建

Vue.js 安装cnpm npm install -g 镜像 cnpm --registry=https://registry.npm.taobao.org 安装 vue.js cnpm install -g vue-cli cnpm cache clean —force cnpm install webpack -g //打开要创建的项目路径目录,创建项目 vue init webpack-simple <项目名> cd <项目名> //安装路由 cnpm install vu

Vue安装及项目介绍

目录 创建Vue项目 环境安装 创建项目 pycharm打开Vue项目 项目目录介绍 入口文件(main.js) 路由配置(router.js ) 组件 前台路由的基本工作流程 目录结构 根组件(App.vue) 页面组件(PageFirst.vue) 小组件(Nav.vue) 配置全局样式文件 目录结构 global.css main.js 组件生命周期钩子 概念 案例 路由的重定向 router.js 创建Vue项目 环境安装 第一步:安装node ? 从node官网下载node安装包---

1. vue-cli脚手架的安装以及项目搭建

1. 搭建项目 gitbash命令: vue init webpack 项目名 2. 项目打包发布 gitbash命令:npm run build 原文地址:https://www.cnblogs.com/qfshini/p/12110745.html

vue+element-ui+echarts 项目搭建

1,  环境搭建 1.1,        Node环境 官方下载node 检查安装情况 node –v npm –v 1.2,        安装cnpm     npm install –g cnpm --registry=https://registry.npm.taobao.org 1.3,        安装vue-cli cnpm install vue-cli -g 2,  项目构建 vue init webpack ‘project-name’ 创建成功后,进入项目根目录,初始化项

php服务器环境安装及项目搭建

2安装运行环境及搭建项目2.1安装apache及测试1)安装apacheyum install httpd 启动apache systemctl start httpd.service 查看运行状态 systemctl status httpd.service 2)编辑测试页面echo "xingming">/var/www/html/index.html 3)打开浏览器输入公网ip地址,结果如下 2.2安装MySQL1)安装mysqlyum install mariadb-se

Django web框架 下载安装 简单项目搭建

什么是web应用? Web应用程序是一种可以通过Web访问的应用程序,程序的最大好处是用户很容易访问应用程序,用户只需要有浏览器即可,不需要再安装其他软件 应用程序有两种模式C/S.B/S.C/S是客户端/服务器端程序,也就是说这类程序一般独立运行.而B/S就是浏览器端/服务器端应用程序,这类应用程序一般借助IE等浏览器来运行.WEB应用程序一般是B/S模式.Web应用程序首先是“应用程序”,和用标准的程序语言,如C.C++等编写出来的程序没有什么本质上的不同.然而Web应用程序又有自己独特的地