zoukankan      html  css  js  c++  java
  • vue-cli 3 脚手架搭建(create)

    地址:https://cli.vuejs.org/zh/guide/
    安装步骤:
    提示:node 版本要 8.9+

    1. 两种方式:
      (1) npm install -g @vue/cli
      (2) yarn global add @vue/cli
      安装完成之后检查 vue --version/ vue -V 检查版本
    2. npm install -g @vue/cli-service-global
    3. 创建项目
      vue create hello-world // 项目名称

    终端:(上下键选择)

    default (bable,eslint) // 默认
    Manually select features // 手动 **选择手动创建项目

    回车
    终端:(上下键移动键,空格键是否选中)
    Vue CLI v3.0.5
    ? Please pick a preset: Manually select features
    ? Check the features needed for your project:

    () Babel
    ( ) TypeScript // 语法
    ( ) Progressive Web App (PWA) Support // PWA
    (
    ) Router // 路由
    (* ) Vuex // store
    ( ) CSS Pre-processors // 预编译
    (
    ) Linter / Formatter // 格式化代码
    ( ) Unit Testing
    ( ) E2E Testing
    //提示: Babel, Router, Vuex, CSS Pre-processors, Linter 选中

    回车
    终端:
    Vue CLI v3.0.5
    ? Please pick a preset: Manually select features // 手动创建项目
    ? Check the features needed for your project: Babel, Router, Vuex, CSS Pre-processors, Linter
    ? 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): Sass/SCSS
    // css 预编译
    ? Pick a linter / formatter config: Prettier // (ESLint + Prettier)格式化程序配置
    ? Pick additional lint features: Lint on save // 保存即检查格式
    ? Where do you prefer placing config for Babel, PostCSS, ESLint, etc.? In dedicated config files
    // 其他配置数据单独存放再一个配置文件内
    ? Save this as a preset for future projects? Yes
    // 是否保存这个项目的配置
    ? Save preset as: SaveVue3.0
    // 是的话 项目命名假设为:SaveVue3.0

    命令:

    1. 使用图形化界面
      vue ui
      图形化数据
    2. yarn serve 启动项目
    3. yarn build 打包项目
      (4,5,6 不可同时执行)
    1. // vscode 代码检测设置
      文件 ~ 首选项 ~ 设置 ~ 工作区
      {
      "editor.formatOnSave": false,
      "eslint.autoFixOnSave": true,
      "eslint.validate": [
      "javascript",{
      "language": "vue",
      "autoFix": true
      },
      "html",
      "vue"
      ]
      }
      vscode 加载插件 ESLint // 代码检测工具
  • 相关阅读:
    Docker——WIN7 安装 Docker实战与入门
    TensorFlow——dropout和正则化的相关方法
    TensorFlow——学习率衰减的使用方法
    TensorFlow——MNIST手写数据集
    TensorFlow——分布式的TensorFlow运行环境
    类加载器
    死亡的对象
    spring boot整合kafka
    Java验证手机号
    类生命周期
  • 原文地址:https://www.cnblogs.com/duanzb/p/10710097.html
Copyright © 2011-2022 走看看