开发工具:WebStorm

先搞好环境

可以看出,想安装@vue/cli需要node.js。先去下载安装好。

然后安装@vue/cli

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

安装webpack

npm install -g webpack
npm install -g webpack-cli

查看版本

C:\Windows\System32>node --version
v8.11.1 C:\Windows\System32>vue --version
3.0.1 C:\Windows\System32>webpack -v
4.17.1

建立工程

F:\WebstormProjects>vue create my_vue

Vue CLI v3.0.1
? Please pick a preset: default (babel, eslint) Vue CLI v3.0.1
✨ Creating project in F:\WebstormProjects\my_vue.
� Initializing git repository...
⚙ Installing CLI plugins. This might take a while... > yorkie@2.0. install F:\WebstormProjects\my_vue\node_modules\yorkie
> node bin/install.js setting up Git hooks
done added packages in .367s
� Invoking generators...
� Installing additional dependencies... added packages in .789s
⚓ Running completion hooks... � Generating README.md... � Successfully created project my_vue.
� Get started with the following commands: $ cd my_vue
$ npm run serve
F:\WebstormProjects>cd my_vue F:\WebstormProjects\my_vue>vue add element � Installing vue-cli-plugin-element... + vue-cli-plugin-element@1.0.
added package in .764s
✔ Successfully installed plugin: vue-cli-plugin-element ? How do you want to import Element? Fully import
? Do you wish to overwrite Element's SCSS variables? Yes
? Choose the locale you want to load zh-CN � Invoking generator for vue-cli-plugin-element...
� Installing additional dependencies... > node-sass@4.9. install F:\WebstormProjects\my_vue\node_modules\node-sass
> node scripts/install.js Cached binary found at d:\Users\\Application Data\npm-cache\node-sass\4.9.
\win32-x64-57_binding.node > node-sass@4.9. postinstall F:\WebstormProjects\my_vue\node_modules\node-sass
> node scripts/build.js Binary found at F:\WebstormProjects\my_vue\node_modules\node-sass\vendor\win32-x
-\binding.node
Testing binary
Binary is fine
added packages in .947s
⚓ Running completion hooks... ✔ Successfully invoked generator for plugin: vue-cli-plugin-element
The following files have been updated / added: src/element-variables.scss
src/plugins/element.js
package-lock.json
package.json
src/App.vue
src/main.js You should review these changes with git diff and commit them. F:\WebstormProjects\my_vue>

最后运行:

 $ cd my_vue
$ npm run serve

..

..

http://localhost:8080/

..

用Webstorm打开我们刚才新建的工程

..

右键package.json

..

双击即可启动项目

..

也可以成功启动,浏览器也可以访问

查看package.json

最新文章

  1. linux下安装Redis以及phpredis模块
  2. 新学习到的vi的一些命令
  3. Tesseract API在VS 2013中的配置以及调用
  4. js浮点数精确计算(加、减、乘、除)
  5. 深入了解Javascript模块化编程
  6. web快速开发c/s软件构架
  7. 关于pushState
  8. android Loger日志类(获取内置sd卡)
  9. Android_life,Intent_note
  10. Educational Codeforces Round 3
  11. 一种快速查询多点DS18B20温度的方法(转)
  12. Spring事务管理配置示例
  13. for..of与for..in
  14. adi i2s 提供的axi_lite接口说明
  15. buffer格式的转换
  16. C++中的字符串的输入输出函数、空字符与空格的区别、字符变量赋值和字符串初始化
  17. vue调试工具的安装
  18. 使用 NGINX 流控和 fail2ban 防止 CC 攻击
  19. win10 安装microsoft.net framework3.5
  20. Hadoop:安装ftp over hdfs

热门文章

  1. python数据结构算法学习自修第一天【数据结构与算法引入】
  2. python SMTP 发送邮件 阿里企业邮箱、163邮箱 及535错误
  3. JDBC 初始。
  4. [UOJ455][UER #8]雪灾与外卖——堆+模拟费用流
  5. HDU 4256 翻译罗马数字
  6. 洛谷P4513 小白逛公园
  7. 「Splay」区间翻转
  8. PHP no input file specified 三种解决方法
  9. python学习日记(基础数据类型及其方法01)
  10. HAOI2017 简要题解