Nuxt 安装及简单使用

最新推荐文章于 2024-09-02 08:27:50 发布

℡仅此、而已

最新推荐文章于 2024-09-02 08:27:50 发布

阅读量2.6k

点赞数

文章标签： Nuxt.js

本文链接：https://blog.csdn.net/Hzq88888/article/details/91394899

版权

nuxt

网址： nuxt网址

1. Nuxt的使用

npm v5.2.0引入的一条命令（npx）,引入这个命令的目的是为了提升开发者使用包内提供的命令行工具的体验
举例：使用express-generator创建项目

老方法：

  npm install express-generator -g
  
  express app

npx方式

  npx express app

npx可以减少我们全局安装脚手架

2. nuxt 安装

我们使用脚手架 create-nuxt-app

避免全局安装，我们使用npx

 npx create-nuxt-app app
 
 npm i 
 
 cd app
 
 yarn run dev

3. nuxt-目录结构

4. nuxt-配置 - nuxt.config.js

nuxt-配置：nuxt-配置

举例：配置 scss

    // 1. 在assets 目录中新建css目录，在css目录中新建  main.scss 文件
        main.scss
            body: {
                background: red;
            }
            
    // 2. 命令行安装loader
    
        yarn add node-sass sass-loader scss-loader -D
    
    // 3. 在 nuxt.config.js 文件中引入scss文件
    
  
        css: [
            'element-ui/lib/theme-chalk/index.css',
            {
                src: '@/assets/css/main.scss',
                lang: 'scss'
            }
        ],

    //