1.安装称手工具 webstorm
官网下载安装，然后重启系统，买个学习账号开始。
WebStorm: The Smartest JavaScript IDE, by JetBrains
2.安装Node.js
官网下载node.js，node -v可以查看安装的node.js版,我这里安装是16.18.0
配置淘宝镜像站
在cmd窗口，输入命令：npm config set registry=http://registry.npm.taobao.org，配置淘宝镜像站，主要好像是用来提升速度。然后执行命令npm config list查看配置。
npm config set registry=http://registry.npm.taobao.org3.安装脚手架：在cmd窗口输入命令
vue3脚架：
npm install -g @vue/clivue2脚架：
npm install vue-cli -g vu2切换到vue3脚架：
npm uninstall -g vue-cli
npm install -g @vue/cli
vue3脚本可以选择创建vue2或者vue3项目如上图最后。
4.webpack安装
安装webpack ,要先安装node.js node.js自带了软件包管理工具npm
npm install webpack
//指定vue2稳定版的：
npm install webpack@4.46.0 -g创建了项目之后在项目文件夹下安装局部：（下面就是在webpacklearn文件夹下安装）
npm install webpack@3.6.0 --save-dev
–save-dev是开发时依赖
webpack是现代javascript应用程序的静态模块打包器，当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。
webpack更加强调模块化开发管理，文件压缩、预处理等功能，是它附带的功能。
注意：
webpack模块化打包webpack为了可以正常运行， 必须依赖node环境，
node环境为了可以正常执行很多代码，又必须依赖各种包，
依赖各种包就需要npm工具(node packages manager node包管理 ）
5.构建一个新的vue项目
找一个空目录， 或创建一个空的文件夹，比如vueDemo。然后在cmd窗口里通过cd命令到这个空文件夹目录下，如图：我在E盘下创建了一个vueDemo的空文件夹
在cmd窗口到达项目目录后，继续执行命令vue init webpack vueDemo来新建项目。
5.启动webstorm ,Open上面创建的项目目录 ，可以在这编辑vue项目代码了。
6.运行,打开项目之后，在下面Termimal 输入 npm run serve ,执行完成之后，显示项目浏览地址:http://localhost:8081
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/101553.html
