vue新建项目

一、安装所需

1、下载、安装node.js

2、运行node -v,npm -v查看是否安装成功，npm install -g npm更新到最新版本

3、下载淘宝npm镜像，因为国内使用npm回很慢，用cnpm安装比较快

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

4、通过npm config get registry或npm info express查看cnpm是否安装成功

 

二、初始化项目

1、用cli2创建项目

1）安装vue-cli

cnpm install vue-cli -g,全局安装vue-cli；

刚安装的，用vue list查看；之前安装的用vue --version查看。

2）创建项目

vue init webpack cell,cell为项目名称

执行后：

·Project name cell

        文件名，默认回车

·Project description

        项目描述

·Author

        作者

·Vue build

        选择默认

·Install vue-router？

        安装vue-router

·Use ESLint to lint your code?

        安装ESLint？选否

·Set up unit tests

        安装单元测试？选否

·Setup e2e tests with Nightwatch?

        安装e2e测试？选否

·Should we run `npm install` for you after the project has been created?

        项目创建完成后，我们是否应该为您运行`npm install`，选择不运行(用上下方向键选择)，因为接下来要用cnpm

3）运行项目

cd cell,进入项目文件夹

cnpm install // yarn install,安装依赖

cnpm run dev // yarn dev，运行项目

 用vue-cli构建的项目结构：

2、cli3创建项目

1） cnpm install -g @vue/cli，全局安装

        如果安装了cli2，需要先卸载cli2：cnpm uninstall -g vue-cli

2)创建项目

vue create cell

执行后：

选择第一项，回车后直接初始化项目；

也可以选择最后一项Manually select features自行选择配置，看个人项目需求：

        空格键是选中与取消，A键是全选

        TypeScript 支持使用 TypeScript 书写源码

        Progressive Web App (PWA) Support PWA 支持。

        Router 支持 vue-router 。

        Vuex 支持 vuex 。

        CSS Pre-processors 支持 CSS 预处理器。

        Linter / Formatter 支持代码风格检查和格式化。

        Unit Testing 支持单元测试。

        E2E Testing 支持 E2E 测试。

3）运行项目

cd cell，进入项目文件夹

npm run serve // yarn serve

运行方式与cli2不同，由npm run dev变成npm run serve，这个可以设置；选择Manually select features可自己选择配置