美文网首页工具
vscode新建vue项目和react项目

vscode新建vue项目和react项目

作者: 年轻人多学点 | 来源:发表于2020-06-29 17:07 被阅读0次

新建vue项目

1.文件 ==> 首选项 ==> 用户代码片段 ==> 输入 vue 然后回车
2.添加配置,让vscode允许自定义的代码片段提示出来

 
{
    "Print to console": {
        "prefix": "vue",
        "body": [
            "<template>",
            "  <div>",
            "    $0",
            "  </div>",
            "</template>",
            "",
            "<script>",
            "",
            "  export default {",
            "    name:'',",
            "    props:[''],",
            "    data () {",
            "      return {",
            "",
            "      };",
            "    },",
            "",
            "    components: {},",
            "",
            "    computed: {},",
            "",
            "    beforeMount() {},",
            "",
            "    mounted() {},",
            "",
            "    methods: {},",
            "",
            "    watch: {}",
            "",
            "  }",
            "",
            "</script>",
            "<style lang='' scoped>",
            "",
            "</style>"
        ],
        "description": "Log output to console"
    }
}

测试方法: 新建vue后缀文件,输入vue,按下tab键,OK

新建react项目

vs code中快速创建react项目模板

1.安装

到vs扩展工具中找到simple react snippets

image

2.使用

安装好之后,使用其为我们提供的快捷键,我们就可以体验飞一般的体验
,快捷键太多,这里举例两种,其他的还需自己根据实际情况查阅使用

新建号react 的js文件后,输入imrc,按tab键则可以为我们快速引入react
结果为:import React, { Component } from ‘react’

输入ccc ,按tab键则可为我们快速生产class模板
结果为:


image

相关文章

  • vscode新建vue项目和react项目

    新建vue项目 1.文件 ==> 首选项 ==> 用户代码片段 ==> 输入 vue 然后回车2.添加配置,让vs...

  • VSCode 新建 React 项目

    1、VSCode编辑器中使用快捷键ctrl+`打开终端2、在终端输入create-react-app demo,自...

  • vue项目新建 vscode

    以下是配置好了相应配置的步骤 1,新建一个文件夹,打开 2,打开终端 3,输入 vue init webpack...

  • vscode中使用eslint开发react

    安装vscode的Eslintimage.pngeslint2.为react项目安装eslint依赖 若为vue项...

  • 使用vue-axios和vue-resource解决vue中调用

    1. 新建vue项目 1.1 新建项目 新建项目 vue init webpack axios_resource ...

  • RN-Redux-Project-01

    React + Redux 搭建项目 1.项目搭建 ①新建项目 ②安装 redux 和 react-redux 2...

  • 手写的npm包

    此指令主要是运用于vscode开发vue项目新建时生成eslint的一些配置配合上vscode商店的(ESLint...

  • vue + cordova 打包webapp

    话不多说,直接上步骤:1.新建cordova项目。 2.新建vue项目。(不会新建vue项目的同学去看vue官网)...

  • RN 常用命令

    1.新建RN项目 //创建项目(新建RNDemo项目) react-native init RNDemo //安装...

  • 新建React项目

    系统:mac os 12.10 依赖项:node.js: v6.10.2npm: v5.6.0 打开命令行: cd...

网友评论

    本文标题:vscode新建vue项目和react项目

    本文链接:https://www.haomeiwen.com/subject/pccafktx.html