• 通过 vue-cli 创建一个 vue3 的项目


    因为我们需要使用最新的模板,所以请保证你的 vue-cli 的版本在 4.5.13 以上,你可以通过以下的方式来查看 你的 vue-cli 版本:
    vue -V

    @vue/cli 4.5.13 // 输出版本号

    如果你需要升级版本,那么可以通过以下指令进行升级:
    npm update -g @vue/cli

    升级之后,即可通过以下方式创建最新的 vue3 项目
    终端输入 vue create 项目名称 ,即可进入 模板选择 模 提示:

    vue create imooc-admin
    // 进入模板选择
    Vue CLI v4.5.13
    ? Please pick a preset:
    Default ([Vue 2] babel, eslint)
    Default (Vue 3) ([Vue 3] babel, eslint)

    Manually select features // 选择手动配置

    // ----------------------------------------------------------

    ? Check the features needed for your project:
    () Choose Vue version // 选择 vue 版本
    (
    ) Babel // 使用 babel
    ( ) TypeScript // 不使用 ts
    ( ) Progressive Web App (PWA) Support // 不使用 PWA
    () Router // 添加 vue-router
    (
    ) Vuex // 添加 vuex

    () CSS Pre-processors // 使用 css 预处理器
    (
    ) Linter / Formatter // 代码格式化
    ( ) Unit Testing // 不配置测试
    ( ) E2E Testing // // 不配置测试

    // ----------------------------------------------------------

    Choose a version of Vue.js that you want to start the project with
    2.x > 3.x // 选择 vue 3.0 版本

    // ----------------------------------------------------------

    Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n) n // 不使用 history模式 的路由

    // ----------------------------------------------------------

    ? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default):

    Sass/SCSS (with dart-sass) // 使用基于 dart-sass 的 scss 预处理器
    Sass/SCSS (with node-sass) Less Stylus

    // ----------------------------------------------------------

    ? Pick a linter / formatter config:
    ESLint with error prevention only ESLint + Airbnb config

    ESLint + Standard config // 使用 ESLint 标准代码格式化方案
    ESLint + Prettier

    // ----------------------------------------------------------

    ? Pick additional lint features:
    (*) Lint on save //

    (*) Lint and fix on commit // 保存时 && 提交时,都进行 lint

    // ----------------------------------------------------------

    ? Where do you prefer placing config for Babel, ESLint, etc.? (Use arrow keys)

    In dedicated config files // 单独的配置文件
    In package.json
    // ----------------------------------------------------------

    Save this as a preset for future projects? (y/N) n // 不存储预设

    等待片刻之后,你的项目就会生成成功。
    生成之后,可以通过以下两个指令来运行你的项目: cd 项目目录 npm run serve

    执行成功之后,项目即可运行!

  • 相关阅读:
    Postgres16版本中FROM子查询别名可以省略不写了
    Javascript中integrity属性安全验证
    tensorflow张量运算
    vue+nodejs+express+jwt如何生成并处理token
    难度大幅上涨!初试公共/专业课都改了!东南大学软件学院考研
    SSM“点点通”餐饮点餐小程序-计算机毕业设计源码11264
    【04】穿越功耗墙,我们该从哪些方面提升“性能”?
    Series (mathematics)
    YOLOV:图像对象检测器在视频对象检测方面表现也很不错
    基于亚马逊云科技Amazon EC2云服务器的G4实例可提供极具成本效益的GPU并支持实时光追技术
  • 原文地址:https://blog.csdn.net/qq_35285627/article/details/126218424