美文网首页
vue 框架的搭建与配置

vue 框架的搭建与配置

作者: 半夜成仙 | 来源:发表于2020-06-30 10:50 被阅读0次

1 搭建项目之前,请确认好你自己已经安装过node, npm, vue cli。没安装的可以参考下面的链接安装。

如何安装node?

安装好node默认已经安装好npm了,所以不用单独安装了。
安装vue cli 4.0

npm install -g @vue/cli

安装好了之后输入 vue -V 查看版本

image.png
如何安装vue cli?
剧场环境已搭建好,开始表演!

1.创建项目

vue create project-one

2.选择配置(自定义配置)

default 是使用默认配置

Manually select features 是自定义配置

image

我的自定义配置如下


image.png

选择是否使用路由 history router,其实直白来说就是是否路径带 # 号,建议选择 N,否则服务器还要进行配置


image.png

css 的预处理器我选择的是 Sass/SCSS(with dart-sass) 。node-sass是自动编译实时的,dart-sass需要保存后才会生效

sass 官方目前主力推 dart-sass 最新的特性都会在这个上面先实现


image.png

选择 ESLint 代码校验规则,提供一个插件化的javascript代码检测工具,ESLint + Prettier 使用较多


image.png

然后选择什么时候进行代码校验,Lint on save 保存就检查,Lint and fix on commit fix 或者 commit 的时候检查,建议第一个


image.png

下面就是如何存放配置了,In dedicated config files 存放到独立文件中,In package.json 存放到 package.json 中

本着项目结构简单的想法,我选择了第二个


image.png

最后就是是否保存本次的配置了,N 不记录,如果选择 Y 需要输入保存名字

我这里就不保存了,原因是熟能生巧!哈哈哈


image.png

然后就等待创建项目吧


image.png

出现如图红框所示的提示,就搭建成功,进入项目目录,直接输入 npm run serve 就可以了

image.png

相关文章

  • 解决SSM+VUE对接跨域问题

    环境配置 基本框架搭建 可参考本人博客地址基本SSM框架搭建 SSM前后分离配置 解决SSM+VUE跨域问题 配置...

  • vue 框架的搭建与配置

    1 搭建项目之前,请确认好你自己已经安装过node, npm, vue cli。没安装的可以参考下面的链接安装。 ...

  • vue框架搭建步骤

    Vue框架搭建 1、vue基础框架搭建 可参照https://www.cnblogs.com/princesong...

  • Vue引入sass并配置全局变量

    Vue引入sass并配置全局变量 引入sass 首先使用官方提供的脚手架vue-cli进行搭建框架,这里就不做说明...

  • vue核心

    初识Vue 搭建基础框架 初识Vue