一、安装vue

npm install vue -g

二、用vue-cli快速搭建项目

//全局安装vue-cli
npm install install -g vue-cli
//创建一个基于webpack模板的项目
vue init webpack [demoname] ? Project name (xxx)
? Project name xxxx
? Project description (A Vue.js project)
? Project description A Vue.js project
? Author (xj <x@xm.com>)
? Author xx <x@xlm.com>
? Vue build (Use arrow keys)
? Vue build standalone
? Install vue-router? (Y/n) y
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n
? Use ESLint to lint your code? No
? Set up unit tests (Y/n) n
? Set up unit tests No
? Setup e2e tests with Nightwatch? (Y/n) n
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recom
? Should we run `npm install` for you after the project has been created? (recom
mended) npm vue-cli · Generated "paixiaoyang_backstage". # Installing project dependencies ...
# ======================== npm WARN deprecated browserslist@2.11.3: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.
npm WARN deprecated bfj-node4@5.3.1: Switch to the `bfj` package for fixes andnew features!
npm WARN deprecated browserslist@1.7.7: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools. > uglifyjs-webpack-plugin@0.4.6 postinstall F:\work\paixiaoyang_backstage\paixiaoyang_backstage\node_modules\webpack\node_modules\uglifyjs-webpack-plugin
> node lib/post_install.js npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN ajv-keywords@3.2.0 requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) added 1127 packages from 646 contributors and audited 10642 packages in 157.659s
found 2 vulnerabilities (1 moderate, 1 high)
run `npm audit fix` to fix them, or `npm audit` for details # Project initialization finished!
# ======================== To get started: cd xxxx
npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack

三、进入项目运行

cd xxxx

//运行
npm run dev

四、在浏览器上打开localhost:8080

vue-cli webpack 快速搭建项目的更多相关文章

  1. 使用vue-cli(vue脚手架)快速搭建项目

    vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目.这篇文章将会从实操的角度,介绍整个搭建的过程. 1. 避坑前言 其实这次使用vue-cli的 ...

  2. vue cli3.0快速搭建项目详解(强烈推荐)

    这篇文章主要介绍下vue-cli3.0项目搭建,项目结构和配置等整理一下,分享给大家. 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cl ...

  3. 让我们用Vue cli全家桶搭建项目

    一般项目都会用到这几个,这里不在详细介绍概念,只是简单的使用.一.搭建cli 1.事先安装好cnpm(淘宝镜像) npm install -g cnpm --registry=https://regi ...

  4. vue cli4.0 快速搭建项目详解

    搭建项目之前,请确认好你自己已经安装过node, npm, vue cli.没安装的可以参考下面的链接安装. 如何安装node? 安装好node默认已经安装好npm了,所以不用单独安装了. 如何安装v ...

  5. 使用vue-cli(vue脚手架)快速搭建项目-2

    接上一篇文章,这篇文章对如何使用IDEA打开并运行项目做教程 1.将在窗口模式启动的Vue关闭 只需要按住Ctrl+C,输入Y就可以了 2.打开idea 3.复制你项目所在地址,然后点击OK 4.下面 ...

  6. 使用Vue CLI 3快速创建项目

    首先 vue create ant-design-vue-pro 执行命令会显示两个选项,1默认,2自定义 我么选择自定义 选择好自定义的插件回车就等待下安装成功然后进入项目文件夹 cd ant-de ...

  7. 基于Vue-cli 快速搭建项目

    Vue-cli可以快速帮助我们创建一个项目,这是官方给我们提供的脚手架.下面我说一下vue-cli的使用方法. 一.准备工作 在使用vue-cli时,首先需要安装nodejs,npm,其次需全局安装v ...

  8. React + webpack 快速搭建开发环境

    因网上大多React + webpack快速搭建的运行不起来,便自行写了一个.在搭建开发环境的前需安装nodejs,npm. 新建一个工作目录,比如叫reactdome,在reactdome目录中运行 ...

  9. (转载) android快速搭建项目积累

    android快速搭建项目积累 2016-04-05 20:07 519人阅读 评论(0) 收藏 举报  分类: android优化(8)   Rx技术(5)  版权声明:本文为博主原创文章,未经博主 ...

随机推荐

  1. Python 元组、列表

    Python中,最常用的数据结构就是序列了.序列有以下几种:元组,列表,字符串等.注:代码都是在IDE中编辑的,没有用交互式环境. 一.元组(tuple) 元组其实有点类似C++中的数组,即一旦指定了 ...

  2. ExtJS 4 MVC Viewport和card布局

    http://ext4all.com/post/a-little-bit-strange-navigation 效果图:  app/view/Viewport.js Ext.define('App.v ...

  3. 洛谷 P3959 宝藏【状压dp】

    一开始状态设计错了-- 设f[i][s]为当前与根节点联通状况为s,最深深度为i 转移的话枚举当前没有和根联通的点集,预处理出把这些点加进联通块的代价(枚举s中的点和当前点的连边乘以i即可),然后用没 ...

  4. 图论算法->最短路

    求最短路算法,有Floyd,dijkstra,Bellmanford,spfa等诸多高级算法.优化方法也是层出不穷. 我们不妨分析一下各算法的使用特点(可能不准确 1.Floyd算法 复杂度O(n³) ...

  5. codeforces 555B Case of Fugitive

    题目连接: http://codeforces.com/problemset/problem/555/B 题目大意: 有n个岛屿(岛屿在一列上,可以看做是线性的,用来描述岛屿位置的是起点与终点),m个 ...

  6. 数学 Codeforces Round #282 (Div. 2) B. Modular Equations

    题目传送门 题意:a % x == b,求符合条件的x有几个 数学:等式转换为:a == nx + b,那么设k = nx = a - b,易得k的约数(>b)的都符合条件,比如a=25 b=1 ...

  7. [BUG]Dreamweaver6做网页的一个图片文字不清晰的问题

    自己用Dreamweaver6做一个网页,使用PS做图片,为了节约下载流量,我把图片裁剪为GIF格式,通过系统自带的图片浏览器和美图看看,图片上的文字都是清晰的. 我把图片加载进入DW中后,在DW界面 ...

  8. 转 ORA-00054 的解决方法

    统有一个不用的索引,想删除这个索引, SQL> drop index GPSTIME_GLOBAL_INDEX  2  /drop index GPSTIME_GLOBAL_INDEX      ...

  9. JMeter(十一)内存溢出解决方法

    使用jmeter进行压力测试时遇到一段时间后报内存溢出outfmenmory错误,导致jmeter卡死了,先尝试在jmeter.bat中增加了JVM_ARGS="-Xmx2048m -Xms ...

  10. Cenos7 切换单用户模式

    CentOS 7在进入单用户的时候和6.x做了很多改变,下面让我们来看看如何进入单用户. 1.重启服务器,在选择内核界面使用上下箭头移动 2.选择内核并按“e” 3.修改参数 将rhgb quiet ...