nuxt.js笔记（一）--- 初步搭建

创建项目（惯用yarn）

 npx create-nuxt-app {项目名称}

安装过程中选了如下配置

image.png

如果有哪儿选的不对，欢迎及时纠正。

安装完毕。

启动项目

yarn dev

完事提示我

Listening on: http://localhost:3000/
把http://localhost:3000/ 粘到浏览器地址栏就能看见项目了。

项目结构（顺序是按当前在我的vscode里的顺序）

.nuxt //置灰文件夹，猜测是nuxt的转化文件目录
components //组件存放目录
components/NuxtLogo.vue //默认里面有个svg的组件
components/Tutorial.vue //默认直接在index.vue里引用的组件
node_modules //依赖包
pages //页面存放目录
pages/index.vue //默认文件，直接展示Tutorial.vue组件的内容
plugins //应该是存放配置的相关文件
plugins->element-ui.js //引入并挂载了elementui，还引入了一个en的包，猜测是语言包
static //存放静态文件
static/favicon.ico //nuxt的官方logo
store //看名字是vuex的文件存放目录
store/README.md //一个备注文件，声明store要不要都行，要是加上了vuex里的文件就自动开启vuex功能，无需额外安装
.editorconfig //开发的配置，声明了权限还有语言、规则，别的没看懂
.eslintcache //没太看懂，里面串json数据，看名字像是eslint的缓存文件
.eslintrc.js //语法检查和格式化的配置文件
.gitignore //git配置忽略文件
.prettierrc //没看懂是啥，里面就两个key的json
nuxt.config.js //nuxt的配置文件
package.json //依赖包管理和运行配置文件
README.md //项目相关的命令文件和一些文件的备注，都是英文，回头翻译一下详解
stylelint.config.js //看着是关于样式格式的配置文件，安装过程中有选安装stylelint，为了代码美观选的，具体作用待确定

要做一个挂在生产环境的项目，还是要快速开发和能够跟调接口的，下一篇文章会讲nuxt+less的使用方式，官网有讲sass，我个人习惯用less，所以还是尊重我自己的爱好。