zoukankan      html  css  js  c++  java
  • Vue入门:Vue项目创建及启动

    1. 创建Vue项目存放地址

    用于存放Vue项目,找个自己处理方便的地方。本人地址:D:Program FilesWorkspaceVue

    2. 创建项目

    进入cmd窗口 进入项目存放地址

    执行命令【vue init webpack HelloWorld】创建Vue项目 [HelloWorld]为项目保存文件夹名称

    录入项目名称

    项目描述及作者

    项目构建

    选择第一项

    是否使用router

    是否使用ESLint

    是否使用单元测试

    是否使用e2e测试

    项目创建后是否执行安装

    选择第一项 是

    创建成功后提示

    4. 启动项目

    进入项目根目录下 执行【npm run dev】

     启动成功后提示

     访问浏览器

    5. 项目结构说明(不完整)

    |-- build                            // 项目构建(webpack)相关代码
    |   |-- build.js                     // 生产环境构建代码
    |   |-- check-version.js             // 检查node、npm等版本
    |   |-- dev-client.js                // 热重载相关
    |   |-- dev-server.js                // 构建本地服务器
    |   |-- utils.js                     // 构建工具相关
    |   |-- webpack.base.conf.js         // webpack基础配置
    |   |-- webpack.dev.conf.js          // webpack开发环境配置
    |   |-- webpack.prod.conf.js         // webpack生产环境配置
    |-- config                           // 项目开发环境配置
    |   |-- dev.env.js                   // 开发环境变量
    |   |-- index.js                     // 项目一些配置变量
    |   |-- prod.env.js                  // 生产环境变量
    |   |-- test.env.js                  // 测试环境变量
    |-- src                              // 源码目录
    |   |-- components                     // vue公共组件
    |   |-- store                          // vuex的状态管理
    |   |-- App.vue                        // 页面入口文件
    |   |-- main.js                        // 程序入口文件,加载各种公共组件
    |-- static                           // 静态文件,比如一些图片,json数据等
    |   |-- data                           // 群聊分析得到的数据用于数据可视化
    |-- .babelrc                         // ES6语法编译配置,里面有一些插件,这些插件的作用是代码的转换
    |-- .editorconfig                    // 编译器的配置,定义代码格式
    |-- .eslintignore                    //忽略语法检查的目录文件
    |-- .eslintrc.js                     //编译规则配置文件,规则定制文件,规则编译不过的时候可以在这里配置为0
    |-- .gitignore                       // git上传需要忽略的文件格式,
    |-- favicon.ico                      // link图标
    |--.postcssrc.js
    |-- index.html                       // 入口页面
    |-- package.json                     // 项目基本信息如:可以配置script脚本  ^上箭头代表可以安装当前版本及以上的版本
    |-- README.md                        // 项目说明
  • 相关阅读:
    BZOJ 1191 HNOI2006 超级英雄hero
    BZOJ 2442 Usaco2011 Open 修建草坪
    BZOJ 1812 IOI 2005 riv
    OJ 1159 holiday
    BZOJ 1491 NOI 2007 社交网络
    NOIP2014 D1 T3
    BZOJ 2423 HAOI 2010 最长公共子序列
    LCA模板
    NOIP 2015 D1T2信息传递
    数据结构
  • 原文地址:https://www.cnblogs.com/LFBlog/p/10740496.html
Copyright © 2011-2022 走看看