nuxt.config.js 配置

简介: 我们在使用Nuxt.js提供的create-nuxt-app 创建项目后,更希望对它自定义一些东西,这里我们可以在根目录下找到nuxt.config.js

我们在使用Nuxt.js提供的create-nuxt-app 创建项目后,更希望对它自定义一些东西,这里我们可以在根目录下找到nuxt.config.js

Nuxt.config.js配置
// cnpm instaill --save-dev address 主要是获取当前设备IP
const address = require('address');
const localhost = address.ip() || 'localhost';

export default {
/
Nuxt rendering mode See https://nuxtjs.org/api/configuration-mode
/
mode: 'universal',
/
Nuxt target See https://nuxtjs.org/api/configuration-target
/
target: 'server',
/
Headers of the page See https://nuxtjs.org/api/configuration-head
/
//process.env
head: {
title: 'project 项目名称',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
],
//以link的方式使用外部资源文件 浏览器icon
link: [
{ rel: 'icon', type: 'image/x-icon', href: 'https://xx.xxx.com/xxxx/logo.jpg' }
],
// 使用外部资源文件,自动生成 script 标签
script: [
{ src: 'https://xxxxxx' }
]
},
/
** Customize the progress-bar color
/
// 进行ajax请求时顶部进度条的颜色
loading: { color: '#f47e36' },
/
** Global CSS
/
// 全局样式导入 具体路径自定义
css: [
// css 重置文件表
'@/assets/css/reset.scss',
//公共class
'@/assets/css/common.scss',
//轮播图
"swiper/dist/css/swiper.css"
],
/
Plugins to load before mounting the App https://nuxtjs.org/guide/plugins
/
plugins: [
// plugins 文件夹下边有介绍
{ src: "~/plugins/vue-swiper.js", ssr: false }
],
/
Auto import components See https://nuxtjs.org/api/configuration-components
/
components: true,
/
** Nuxt.js dev-modules
/
buildModules: [
],
/
** Nuxt.js modules
/
// nuxt 模块扩展
modules: [
// Doc: https://axios.nuxtjs.org/usage
'@nuxtjs/axios'
],
/
Axios module configuration See https://axios.nuxtjs.org/options
/
axios: {
// 超时设置
timeout: 10000,
retry: { retries: 3 }
},
/
Build configuration See https://nuxtjs.org/api/configuration-build/
/
build: {
},
server :{
host: localhost,
port:3100
},
env :{
npm_package_name:'project 项目名称'
}
}

相关文章
|
2月前
|
JavaScript
Nest.js 实战 (十一):配置热重载 HMR 给服务提提速
这篇文章介绍了Nest.js服务在应用程序引导过程中,TypeScript编译对效率的影响,以及如何通过使用webpackHMR来降低应用实例化的时间。文章包含具体教程,指导读者如何在项目中安装依赖包,并在根目录下新增webpack配置文件webpack-hmr.config.js来调整HMR相关的配置。最后,文章总结了如何通过自定义webpack配置来更好地控制HMR行为。
|
2月前
|
算法 安全 Java
微服务(四)-config配置中心的配置加解密
微服务(四)-config配置中心的配置加解密
|
12天前
|
JavaScript 前端开发 开发者
如何在 Visual Studio Code (VSCode) 中使用 ESLint 和 Prettier 检查代码规范并自动格式化 Vue.js 代码,包括安装插件、配置 ESLint 和 Prettier 以及 VSCode 设置的具体步骤
随着前端开发技术的快速发展,代码规范和格式化工具变得尤为重要。本文介绍了如何在 Visual Studio Code (VSCode) 中使用 ESLint 和 Prettier 检查代码规范并自动格式化 Vue.js 代码,包括安装插件、配置 ESLint 和 Prettier 以及 VSCode 设置的具体步骤。通过这些工具,可以显著提升编码效率和代码质量。
135 4
|
24天前
|
JavaScript 前端开发 应用服务中间件
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
119 0
|
2月前
|
JavaScript
Vue3基础(19)___vite.config.js中配置路径别名
本文介绍了如何在Vue 3的Vite配置文件`vite.config.js`中设置路径别名,以及如何在页面中使用这些别名导入模块。
71 0
Vue3基础(19)___vite.config.js中配置路径别名
|
1月前
|
前端开发 JavaScript
vite vue3 config配置
【10月更文挑战第5天】
49 0
|
3月前
|
移动开发 JavaScript 前端开发
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
这篇文章介绍了在UniApp H5项目中处理跨域问题的两种方法:通过修改manifest.json文件配置h5设置,或在项目根目录创建vue.config.js文件进行代理配置,并提供了具体的配置代码示例。
UniApp H5 跨域代理配置并使用(配置manifest.json、vue.config.js)
|
3月前
|
JSON 前端开发 JavaScript
vue.config.js配置详解
【8月更文挑战第16天】vue.config.js配置详解
56 1
vue.config.js配置详解
|
3月前
|
Web App开发 安全 JavaScript
【Azure 应用服务】App Service 通过配置web.config来添加请求返回的响应头(Response Header)
【Azure 应用服务】App Service 通过配置web.config来添加请求返回的响应头(Response Header)
|
3月前
|
缓存 NoSQL 网络协议
【Azure Redis 缓存】如何使得Azure Redis可以仅从内网访问? Config 及 Timeout参数配置
【Azure Redis 缓存】如何使得Azure Redis可以仅从内网访问? Config 及 Timeout参数配置
下一篇
无影云桌面