创建项目(惯用yarn)
npx create-nuxt-app {项目名称}
安装过程中选了如下配置
如果有哪儿选的不对,欢迎及时纠正。
安装完毕。
启动项目
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,所以还是尊重我自己的爱好。