vscode怎么新建vue项目

1:确认必要环境已安装

vscode,和nodejs必须安装好
vscode下载地址:https://code.visualstudio.com/Download
nodejs下载地址:https://nodejs.org/en/download这里写自定义目录标题)

2:在本地创建一个存放工程的目录

我这里放到d:\usr\myvue

3:使用vscode打开上一步创建的文件夹

4:安装vue-cli

vue-cli可以帮助我们快速构建vue项目。
打开终端>新建终端 执行命令:npm install -g vue-cli

5:安装webpack

webpack是js的打包工具
在终端中执行命令:npm install -g webpack

6:创建项目

终端中输入:vue init webpack myvue
如果报如下错误:
在这里插入图片描述
解决办法:
a:在windows系统中打到windows powerShell,并以管理员身份运行它
b:输入set-ExecutionPolicy RemoteSigned 回车
c:输入y确认
d:再从第五步重新执行即可

7:运行项目

执行命令:cd myvue
执行命令:npm run dev
终端出现浏览器访问地址:http://localhost:8080
说明项目已经创建成功 vscode左侧的目录就会出现vue项目的相关文件夹了

8:项目打包发布线上

重新打开一个终端
输入命令:npm run build
会在项目目录中生成一个dist的文件夹,将此文件夹放到nginx容器中即可运行。

你可能感兴趣的:(vue.js,vscode)