使用vue CLI 3创建项目

vue cli3通过命令vue create创建一个项目,首先查看帮助功能：
$ vue create --help
但是终端输出：

vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6.
  You may want to run the following to upgrade to Vue CLI 3:

  npm uninstall -g vue-cli
  npm install -g @vue/cli

也就是要先卸载vue cli2,然后重新安装vue cli 3。

升级vue cli

执行$ npm uninstall -g vue-cli:

removed 237 packages in 1.824s

再执行$ npm install -g @vue/cli:

npm WARN deprecated hoek@5.0.4: This version is no longer maintained. Please upgrade to the latest version.
npm WARN deprecated cross-spawn-async@2.2.5: cross-spawn no longer requires a build toolchain, use it instead
/Users/chenxin/.nvm/versions/node/v8.12.0/bin/vue -> /Users/chenxin/.nvm/versions/node/v8.12.0/lib/node_modules/@vue/cli/bin/vue.js

> fsevents@1.2.4 install /Users/chenxin/.nvm/versions/node/v8.12.0/lib/node_modules/@vue/cli/node_modules/fsevents
> node install

[fsevents] Success: "/Users/chenxin/.nvm/versions/node/v8.12.0/lib/node_modules/@vue/cli/node_modules/fsevents/lib/binding/Release/node-v57-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile

> protobufjs@6.8.8 postinstall /Users/chenxin/.nvm/versions/node/v8.12.0/lib/node_modules/@vue/cli/node_modules/protobufjs
> node scripts/postinstall


> nodemon@1.18.7 postinstall /Users/chenxin/.nvm/versions/node/v8.12.0/lib/node_modules/@vue/cli/node_modules/nodemon
> node bin/postinstall || exit 0

Love nodemon? You can now support the project via the open collective:
 > https://opencollective.com/nodemon/donate

npm WARN @apollographql/apollo-upload-server@5.0.3 requires a peer of graphql@^0.13.1 but none is installed. You must install peer dependencies yourself.

+ @vue/cli@3.2.1
added 735 packages from 515 contributors in 120.363s

可以看到升级到了vue cli 3.2.1

创建项目

使用$ vue create gsc-front-user创建项目：

Vue CLI v3.2.1
? Please pick a preset: (Use arrow keys)
❯ default (babel, eslint) 
  Manually select features 

这里会让选择如何创建，一般建议选Manually select features。关于细节可以参考使用 vue-cli 3 快速创建 Vue 项目。

参考

• webpack 相关
• 创建一个项目

启动服务器

进入项目文件夹:

$ cd gsc-front-user

执行$ npm run serve启动服务器：

> gsc-front-user@0.1.0 serve /Users/chenxin/Workspaces/gsc/gsc-front-user
> vue-cli-service serve

 INFO  Starting development server...
 98% after emitting CopyPlugin                                                .  
 DONE  Compiled successfully in 3125ms                                  20:17:11

 
  App running at:
  - Local:   http://localhost:8080/ 
  - Network: http://192.168.0.103:8080/

  Note that the development build is not optimized.
  To create a production build, run npm run build.

然后打开浏览器访问http://localhost:8080/