使用vue-cli3搭建项目过程

一、搭建前准备

  node.js版本为8.9+;

  安装模块:npm install -g n // 安装模块 这个模块是专门用来管理node.js版本的;

  若原先已经安装,则更细模块:n stable // 更新你的node版本;

  若事先安装了vue-cli,则先卸载:npm uninstall vue-cli -g;

  若安装了cli3,后还想用vue-cli2,全局安装一个桥接工具:

  npm install -g @vue/cli-init//安装完后 就还可以使用 vue init 命令

vue init webpack my_project

二、开始安装

  1、npm install -g @vue/cli // 安装cli3.x

  2、vue --version // 查询版本是否为3.x

  3、安装拓展:npm install -g @vue/cli-service-global

  4、选择配置

    

    一开始只有两个选项: default(默认配置)和Manually select features(手动配置)

    默认配置只有babeleslint其他的都要自己另外再配置,所以我们选第二项手动配置。

    

    这里按需选择

    接下来一直按enter就可以。

 

    

原文地址:https://www.cnblogs.com/linjiangjin/p/10229105.html

时间: 2024-10-11 06:52:17

使用vue-cli3搭建项目过程的相关文章

关于vue-cli搭建项目过程中的一些基本问题与个人理解

刚接触vue.js不久,组件化的创作模式感觉很棒.组件好比每一块积木,而一个项目的完成就像你去搭一个积木模型,每一块积木都可以互相配合搭建各式各样的模型,但又相对独立可以重复使用.这就是传说中的低耦合高复用. 因公司要求使用vue-cli脚手架的形式搭建项目前端框架,参照一些网上的包含官网文档的指导,对搭建的整个过程当中碰到的一些基本问题做一个总结并对整个项目结构做一个梳理. 一.安装node.js 官方网址:https://nodejs.org/zh-cn/ 选择合适自己的版本进行安装. 1.

vue cli搭建项目及文件引入

cli搭建方法:需安装nodejs先 1.npm install -g cnpm --registry=https://registry.npm.taobao.org //安装cnpm,用cnpm下载东西有时会快一些 2.cnpm i -g vue-cli  //安装 vue-cli,i:install 安装,-g:全局,哪儿都可以使用. 3.vue init webpack-simple ProjectName //webpack-simple:使用webpack-simple模板,proje

VUE神速搭建项目

1.npm install -g vue-cli 全局安装vue-cli脚手架 2.vue init webpack vueTest 初始化一个基于webpack的项目 3.cd vueTest 进入到这个项目 4.npm install 安装 5.npm run dev 运行访问.默认8080端口 配置自动打开页面: config下的index.js进行配置 原文地址:https://www.cnblogs.com/ll15888/p/11219909.html

vue cli3同一个项目下的多页应用创建

0x00.页面效果: 表面看类似路由切换,实际上是两个vue的实例,挂载在不同的根节点上. 0x01.总体目录结构: 项目分为三个模块,也就是三个多页应用,police.relatives.self. 0x02.以self为例,剖析self内部结构: 1.self模块的入口index.js,相当于单页应用的main.js: import Vue from 'vue' import App from './index.vue' import router from './router' // im

vue+ts搭建项目

Tip: 为了避免浪费您的时间,本文符合满足以下条件的同学借鉴参考 1.本文模版不适用于小型项目,两三个页面的也没必要用vue2.对typescript.vue全家桶能够掌握和运用 此次项目模版主要涉及的技术框架: vue2.5 vuex3.0 vue-router3.0 axios typescript3.2 Tip: 由于vue-cli3.0帮我们简化了webpack的配置,我们只需要在根目录下的vue.config.js文件的chainWebpack进行配置即可. 接下来进入正题(前提是你

【vue】vue +element 搭建项目,this.$nextTick用法

相关资料:https://www.cnblogs.com/leaf930814/p/7247478.html https://www.cnblogs.com/duanyue/p/7458340.html   http://www.cnblogs.com/hity-tt/p/6733062.html 原文地址:https://www.cnblogs.com/websmile/p/8761442.html

Vue CLI3 关闭热替换后出现的warning

用vue cli3做项目的时候如果开启了typescript的严格模式,在dev server热替换的时候往往就会打出一大堆warning,严重的影响了编译效率.官方并没有提供关闭warning的api,但是提供了修改webpack配置项的接口.通过这个接口我们就可以实现关闭warning. 根据文档webpack 相关 | Vue CLI 3 导出项目的配置为output.js,搜索check单词可发现一个插件:fork-ts-checker(github:Realytics/fork-ts-

不使用 vue-cli 与 vue 模版,使用 Vue2.x + webpack4.x 从零开始一步步搭建项目框架

说明 这是我根据慕课网上的一个课程 Vue+Webpack打造todo应用 过程一步步搭下来的框架,去掉了业务相关的逻辑. 项目最终的效果包括了引入vue框架:使用CSS预处理器:使用babel:引用图片等静态资源:区分开发环境与生成环境,并做相应优化等.基本接近真正做项目时候的配置. 但是!! 毕竟是我个人根据练习课程搭的框架,跟真实工作可能有区别,请谨慎直接用于工作环境!!! 项目的最终成果看这里:https://gitee.com/Dandelion_/vue-webpack-scaffo

VUE CLI3.X 创建项目

Node.js环境搭建 Node.js基于V8引擎,可以让js代码脱离浏览器运行 Vue CLI3.0 需要Node.js 8.9或者更高版本. 用nvm或者nvm-windows在同一台电脑中管理多个Node版本 nvm github地址:https://github.com/nvm-sh/nvm Vue CLI 3.0环境搭建 卸载老版本vue-cli:npm uninstall vue-cli -g 安装新版本:npm install -g @vue/cli 原型开发:npm instal