一、创建 React 项目

  1. 安装 Node.js 和 npm:确保已经安装了 Node.js 和 npm,可通过在命令行中输入node -v和npm -v来检查是否安装成功以及查看版本号。
  2. 安装 create-react-app:在命令行中运行以下命令全局安装 create-react-app(如果之前已经安装过,可以跳过这一步):

    收起

    plaintext

    npm install -g create-react-app
    
  3. 创建项目:
    • 打开 VSCode,点击顶部菜单的 “终端” -> “新建终端”,在终端中输入以下命令来创建一个新的 React 项目(my-react-app是项目名称,可自行修改):
     

    收起

    plaintext

    create-react-app my-react-app
    
     
    • 等待项目创建完成,这可能需要一些时间,取决于网络速度和电脑性能。
    • 项目创建完成后,在 VSCode 的左侧文件资源管理器中,点击 “打开文件夹”,选择刚刚创建的my-react-app文件夹,即可打开该 React 项目。

二、创建 Vue 项目

  1. 安装 Node.js 和 npm:同创建 React 项目的第一步。
  2. 安装 Vue CLI:在命令行中运行以下命令全局安装 Vue CLI(如果之前已经安装过,可以跳过这一步):

    收起

    plaintext

    npm install -g @vue/cli
    
  3. 创建项目:
    • 在 VSCode 中打开终端,输入以下命令创建一个新的 Vue 项目(my-vue-app是项目名称,可自行修改):
     

    收起

    plaintext

    vue create my-vue-app
    
     
    • 然后会提示你选择一个预设,你可以选择默认预设(default)或手动选择特性(manually select features)。如果你是初学者,建议选择默认预设;如果你对 Vue 项目的配置比较熟悉,可以选择手动选择特性,然后根据自己的需求勾选相关的功能,如 Babel、Router、Vuex 等。
    • 选择好预设后,等待项目创建完成。
    • 项目创建完成后,同样在 VSCode 的左侧文件资源管理器中,点击 “打开文件夹”,选择刚刚创建的my-vue-app文件夹,即可打开该 Vue 项目。

创建好项目后,你就可以在 VSCode 中进行代码编写和开发了。在开发过程中,可以利用 VSCode 的各种插件来提高开发效率,例如对于 React 项目,可以安装 ES7 React/Redux/GraphQL/React-Native snippets等插件;对于 Vue 项目,可以安装 Vetur等插件。

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐