作者：threedayman
来源：恒生LIGHT云社区
安装 node.js
Node.js 是一个开源和跨平台的 JavaScript 运行时环境。
下载地址http://nodejs.cn/download/** 选择对应版本进行安装**
安装完之后运行以下命令验证安装是否成功,出现对应得版本号信息即为安装成功。
C:\Users\hspcadmin>node -vv16.13.0
复制代码
安装 cnpm
npm（node package manager）是 node.js 的包管理器，用于 node 插件管理。
因为 npm 安装插件从国外服务器上下载，受网络影响较大。cnpm 从淘宝镜像中拉取相关插件，减少因为网络等原因造成的异常。
npm install -g cnpm --registry=https://registry.npm.taobao.org
复制代码
安装完成后通过以下命令来查看是否安装成功,出现版本信息即表明安装成功。
C:\Users\hspcadmin>cnpm -vcnpm@7.1.0 (C:\Users\hspcadmin\AppData\Roaming\npm\node_modules\cnpm\lib\parse_argv.js)npm@6.14.15 (C:\Users\hspcadmin\AppData\Roaming\npm\node_modules\cnpm\node_modules\npm\lib\npm.js)node@16.13.0 (D:\software\nodejs\node.exe)npminstall@5.3.1 (C:\Users\hspcadmin\AppData\Roaming\npm\node_modules\cnpm\node_modules\npminstall\lib\index.js)prefix=C:\Users\hspcadmin\AppData\Roaming\npmwin32 x64 10.0.19041registry=https://registry.npmmirror.com
复制代码
安装 vue-cli
vue-cli 致力于将 Vue 生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接，这样你可以专注在撰写应用上，而不必花好几天去纠结配置的问题。
运行以下命令确认是否安装成功
C:\Users\hspcadmin>vue -V@vue/cli 4.5.15
复制代码
项目创建
通过 vue-cli 创建项目
D:\vueproject>vue create vue-hello
Vue CLI v4.5.15? Please pick a preset: (Use arrow keys)> Default ([Vue 2] babel, eslint) Default (Vue 3) ([Vue 3] babel, eslint) Manually select features
复制代码
选择默认 Default ([Vue 2] babel, eslint)选项
success Saved lockfile.Done in 49.84s.⚓ Running completion hooks...
📄 Generating README.md...
🎉 Successfully created project vue-hello.👉 Get started with the following commands:
$ cd vue-hello $ yarn serve
复制代码
创建成功后出现以上提示信息。
运行创建的项目
D:\vueproject>cd vue-helloD:\vueproject\vue-hello>npm run serve
> vue-hello@0.1.0 serve> vue-cli-service serve
INFO Starting development server...98% after emitting CopyPlugin
DONE Compiled successfully in 6318ms 下午7:25:14
App running at: - Local: http://localhost:8080/ - Network: http://192.168.114.25:8080/
Note that the development build is not optimized. To create a production build, run yarn build.
复制代码
访问 http://localhost:8080/ 出现以下页面
4053
至此我们第一个 vue 的项目已经运行起来了。
更多 VUE 知识请参考官网https://cn.vuejs.org/
评论