安装node
使用淘宝 NPM 镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
全局删除vue-cli
npm uninstall vue-cli -g //2.0
npm uninstall -g @vue/cli //3.0
//查看全局安装目录
npm list -g --depth=0
全局安装vue-cli
npm install -g vue-cli //2.0最新版本
npm install -g vue-cli@2.x.x //2.0指定版本
npm install -g @vue/cli //3.0以上最新版本
npm install -g @vue/cli@3.x.x //3.0及其以上指定版本
vue -V 检查版本
创建项目
vue init webpack projectName //2.0版本
vue create projectName //3.0版本
vue ui //3.0版本 使用图形化界面创建项目
如果vueui报错,用管理员身份启动cmd 执行set-ExecutionPolicy RemoteSigned 选择y
启动项目
npm run dev // 2.0
cd 项目名 //3.0
npm run serve //3.0
npm install = npm i。在git clone项目的时候,项目文件中并没有 node_modules文件夹,项目的依赖文件可能很大。直接执行,npm会根据package.json配置文件中的依赖配置下载安装。
-global = -g,全局安装,安装后的包位于系统预设目录下
--save = -S,安装的包将写入package.json里面的dependencies,dependencies:生产环境需要依赖的库
--save-dev = -D,安装的包将写入packege.json里面的devDependencies,devdependencies:只有开发环境下需要依赖的库
Vue.config.productionTip = false //阻止启动生产消息,常用作指令
? Project name (vue-cli-2.0)
? Project description (A Vue.js project)
? Author (chenhanfu <969xxxx22@qq.com>)
? Vue build (Use arrow keys)
> 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
? Install vue-router? (Y/n)
? Use ESLint to lint your code? (Y/n) //如果选择Y则会有下边的pick选项,如果选择n则不会有pick选项
? Pick an ESLint preset (Use arrow keys)
> Standard (https://github.com/standard/standard)
> Airbnb (https://github.com/airbnb/javascript)
> none (configure it yourself)
? Set up unit tests (Y/n) //如果选择Y则会有下边的pick选项,如果选择n则不会有pick选项
? Pick a test runner (Use arrow keys)
> Jest
> Karma and Mocha
> none (configure it yourself)
? Setup e2e tests with Nightwatch? (Y/n)
? Should we run `npm install` for you after the project has been created? (recommended) (Use arrow keys)
> Yes, use NPM
> Yes, use Yarn
> No, I will handle that myself
? Please pick a preset: (Use arrow keys)
> default (babel, eslint)
> Manually select features
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
> (*) Babel
> ( ) TypeScript
> ( ) Progressive Web App (PWA) Support
> ( ) Router
> ( ) Vuex
> ( ) CSS Pre-processors
> (*) Linter / Formatter
> ( ) Unit Testing
> ( ) E2E Testing
? Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n)
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): (Use arrow keys)
> Sass/SCSS (with dart-sass)
> Sass/SCSS (with node-sass)
> Less
> Stylus
? Where do you prefer placing config for Babel, ESLint, etc.? (Use arrow keys)
> In dedicated config files
> In package.json
? Save this as a preset for future projects? (y/N)
网友评论