美文网首页
nuxt.js笔记(一)--- 初步搭建

nuxt.js笔记(一)--- 初步搭建

作者: 尚有 | 来源:发表于2021-12-03 14:47 被阅读0次

    创建项目(惯用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,所以还是尊重我自己的爱好。

    相关文章

      网友评论

          本文标题:nuxt.js笔记(一)--- 初步搭建

          本文链接:https://www.haomeiwen.com/subject/pqopxrtx.html