zoukankan      html  css  js  c++  java
  • vue4 项目的创建

    1,安装vue cli 脚手架,是全局安装
    npm install -g @vue/cli

    可以在输出信息中看到安装位置,例如:
    C:UsersxiaochangjianAppDataRoaming pm ode_modules@vue

    2,查看脚手架是否安装成功
    vue --version


    3,cmd 定位到要创建项目的目录位置


    4,vue create 项目名字 如:vue create ruoyi-front-ui

    通过键盘上下左右键,选择手动配置项目,出现如图文字:

    Vue CLI v4.4.6
    ? Please pick a preset: Manually select features
    ? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
    >(*) Babel
    ( ) TypeScript
    ( ) Progressive Web App (PWA) Support
    ( ) Router
    ( ) Vuex
    ( ) CSS Pre-processors
    (*) Linter / Formatter
    ( ) Unit Testing
    ( ) E2E Testing


    按方向键进行上下选择
    按空格 选中
    按A键全选
    按I键全选
    按enter 确认所有配置进入下一步

    ----------------------------------------------------------------------------------------------------------------

    选中所有:
    Use class-style component syntax? (Y/n) 是否使用class风格的组件语法?

    Pick additional lint features? Lint on save // 保存就检测

    ? Save this as a preset for future projects? (y/N) N //是否记录下,以便下次继续使用这套配置


    Vue CLI v4.4.6
    ? Please pick a preset: Manually select features
    ? Check the features needed for your project: Babel, TS, PWA, Router, Vuex, CSS Pre-processors, Linter, Unit, E2E
    ? Use class-style component syntax? Yes // 是否使用class风格的组件语法?
    ? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes 这个选项的意思是要不要使用 babel 工具自动为转换后的 TypeScript 代码注入 polyfiills 。如果实在搞不清楚具体是什么意思,可以先不用管,直接选择 Y ,进入下一步
    ? Use history mode for router? (Requires proper server setup for index fallback in production) Yes 是不是用history模式来创建路由
    ? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): Less 询问项目的CSS预处理器 选择LESS
    ? Pick a linter / formatter config: Standard (询问项目的格式校验方式,提供一个插件化的javascript代码检测工具 ESLint + Prettier //使用较多)
    ? Pick additional lint features: Lint on save 询问项目的什么时候校验格式(1是保存时,2是提交时)
    ? Pick a unit testing solution: Mocha (Mocha 灵活,Jest 安装配置简单容易上手)
    ? Pick an E2E testing solution: Cypress (Cypress E2E功能测试框架 会安装很长一段时间)
    ? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files 询问项目的配置文件存放在哪儿(1是独立文件,2是在package.json)这里选择独立的文件,选择2在后续配置postcs适配时存在问题。
    ? Save this as a preset for future projects? (y/N) 是否作为一个模板配置

    当前项目示例:
    Vue CLI v4.4.6
    ? Please pick a preset: Manually select features
    ? Check the features needed for your project: Babel, TS, PWA, Router, Vuex, CSS Pre-processors, Linter, Unit, E2E
    ? Use class-style component syntax? Yes
    ? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes
    ? Use history mode for router? (Requires proper server setup for index fallback in production) Yes
    ? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): Less
    ? Pick a linter / formatter config: Prettier
    ? Pick additional lint features: Lint on save
    ? Pick a unit testing solution: Mocha
    ? Pick an E2E testing solution: Cypress
    ? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files
    ? Save this as a preset for future projects? (y/N)

  • 相关阅读:
    [bug] MySQL: The user specified as a definer ('root'@'%') does not exist
    [java] Maven安装本地jar包
    [bug] Openresty:content_by_lua_file 404
    [bug] Failed building wheel for xxx
    [bug] TypeError : unsupported operand type(s) for += : 'NoneType' and 'int'
    [Python] Flask从0到1开发轻量级网页
    [bug]Flask:KeyError: 'A secret key is required to use CSRF.'
    [bug] sqlalchemy.exc.InternalError: (pymysql.err.InternalError) (1054, "Unknown column 'recevie_name' in 'field list'")
    mac os 解决Error: EMFILE: too many open files错误
    从零开始的react入门教程(一),让我们从hello world开始
  • 原文地址:https://www.cnblogs.com/xcj26/p/13397758.html
Copyright © 2011-2022 走看看