vue-cli 新建模板项目---vue-cli

首先要安装好node.js，然后才可以用vue。

设置淘宝镜像：大家都知道国内直接使用 npm 的官方镜像是非常慢的，这里推荐使用淘宝 NPM 镜像。

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

这样就可以使用 cnpm 命令来安装模块了： cnpm install[name]

安装webpack

cnpm install webpack-g

安装vue脚手架

npm install vue-cli-g

在硬盘上找一个文件夹放工程用的，在终端中进入该目录

然后就可以创建vue项目了

环境要求：安装有 Node.js、 vue、 vue-cli

cd目录路径

步骤：

cd 目录(你要把项目放在哪个目录)；
vue init webpack pname(你的项目名字)；
? Project description (A Vue.js project) vue-cli新建项目(项目描述)；
? Author (xhdx <zhuming3834@sina.com>) ；zhuming3834@sina.com(项目作者)；
? Vue build ❯ Runtime + Compiler: recommended for most users Runtime-only: about 6KB lighter min+gzip, but templates (or any Vue-specific HTML) are ONLY allowed in .vue files - render functions are required elsewhere
这里选择Runtime + Compiler: recommended for most users；
? Install vue-router? (Y/n) y 是否使用vue-router，这里根据需求选择；
? Use ESLint to lint your code? (Y/n) y 是否使用ESLint，这里根据需求选择；
? Pick an ESLint preset (Use arrow keys) ❯ Standard (https://github.com/feross/standard) Airbnb (https://github.com/airbnb/javascript) none (configure it yourself) 这里选择Standard (https://github.com/feross/standard)
? Setup unit tests with Karma + Mocha? (Y/n) n 是否需要单元测试，这里根据需求选择；
Setup e2e tests with Nightwatch? (Y/n) n是否需要单元测试，这里根据需求选择；
cd pname(项目目录)；
npm install 安装依赖；
npm run dev 本地运行项目

结果

默认浏览器会自动打开http://localhost:8080/#/，出现如下页面：

转载于:https://www.cnblogs.com/Denghejing/p/9202602.html

vue-cli 新建模板项目---vue-cli相关推荐

VUE+VSCODE(新建一个项目）
VUE+VSCODE(新建一个项目) vue 新建一个项目 vue init webpack projectName ①.Project name (sanfeng1):项目名称(sanfeng1). ...
vue如何新建一个项目
vue创建项目(npm安装→初始化项目) 第一步npm安装首先:先从nodejs.org中下载nodejs 双击安装,在安装界面一直Next 等待node.js安装完成,在DOS命令窗口下对node ...
vue如何新建一个项目（超详细哦--转）
原文链接 vue创建项目(npm安装→初始化项目) 第一步npm安装首先:先从nodejs.org中下载nodejs 双击安装,在安装界面一直Next 直到Finish完成安装. 打开控制命令行程序 ...
从零开始，手把手交给你vue如何新建一个项目
vue创建项目(npm安装→初始化项目) 第一步npm安装首先:先从nodejs.org中下载nodejs 图1 双击安装,在安装界面一直Next 图2 图3 图4 直到Finish完成安装. 打开 ...
vue如何新建一个项目（详细步骤）
vue创建项目一.安装node环境与npm 1.首先:先从https://nodejs.org/en/中下载node.js 按照提示一直点next,直到Finish完成安装 2.打开控制命令程序cm ...
vue 插入word模板项目_10 分钟为你的 vue 项目编写代码文档
代码文档是软件开发使用和维护的必备资料,有了文档,开发和维护以及协作的效率将变得大大提升.tips:如果对 JSDoc 已经熟悉,可以直接跳到实战演练环节. 什么是文档?软件文档或者源代码文档是指与软 ...
Vue使用vue-cli创建vue的模板项目---vue工作笔记0018
然后我们使用vue-cli脚手架,来创建一个demo项目去. 可以看到上面是过程中,用到的命令. 首先我们应该先去安装nodejs的环境对吧,先去安装nodejs以后,这个npm,命令我们就可以使用了 ...
vue 插入word模板项目_vue项目前端导出word文件(bug解决)
摘要:之前项目中导出价格表是由后端实现,前端只需要调用接口下载word即可,后来业务改变比较大,word模版需要一直改动,后端改起来相对麻烦,后来直接前端自己定义模版,实现下载word文档. 一.需要 ...
Vue笔记：webpack项目vue启动流程
VUE启动流程 1. package.json 在执行npm run dev的时候,会在当前目录中寻找 package.json 文件, 有点类似 Maven 的 pom.xml 文件,包含项目的名称 ...