nuxt如何修改默认首页?
某开源项目前端工程用的vue、nuxt、typescript等技术栈写的,默认页面pages有两个vue组件
- index.vue 项目首页,默认页面
- auth.vue 登录页面
由于项目属于nuxt结构,所以我找不到router.js配置的地方,在.nuxt地下确实有router.js和router.json,但是每次修改重启项目编译之后又被覆盖了。
我想让用户访问的时候就访问的auth.vue组件,如何配置?
nuxt.config.js配置如下:
import colors from 'vuetify/es5/util/colors'import i18n from './i18n'
export default {
ssr: false,
/*
** Headers of the page
*/
head: {
titleTemplate: '语料标注工具',
title: '语料标注工具' || '',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: '自然语言处理语料标注工具' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' },
]
},
server: {
host: '0.0.0.0' // default: localhost
},
env: {
baseUrl: '/v1'
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
/*
** Global CSS
*/
css: [
],
/*
** Plugins to load before mounting the App
*/
plugins: [
'~/plugins/filters.js',
'~/plugins/vue-youtube.js',
'~/plugins/vue-shortkey.js',
'~/plugins/services.ts',
'~/plugins/color.ts',
'~/plugins/role.ts'
],
/*
** Nuxt.js modules
*/
modules: [
['nuxt-i18n', i18n],
// Doc: https://axios.nuxtjs.org/usage
'@nuxtjs/axios',
'@nuxtjs/eslint-module'
],
buildModules: [
'@nuxt/typescript-build',
'@nuxtjs/composition-api/module',
['@nuxtjs/google-analytics', {
id: process.env.GOOGLE_TRACKING_ID
}],
[
'@nuxtjs/vuetify',
{
customVariables: ['~/assets/css/fonts.css'],
treeShake: true,
defaultAssets: {
font: false,
icons: ['mdiSvg'],
},
},
],
[
'@nuxtjs/google-fonts',
{
families: {
Roboto: [100, 300, 400, 500, 700, 900]
},
display: 'swap',
download: true,
overwriting: true,
inject: true,
}
]
],
/*
** Axios module configuration
** See https://axios.nuxtjs.org/options
*/
axios: {
proxy: true
},
proxy: {
// Use a fake value for use at build-time
'/v1/': {
target: process.env.API_URL || 'http://127.0.0.1:8000'
}
},
/*
** vuetify module configuration
** https://github.com/nuxt-community/vuetify-module
*/
vuetify: {
theme: {
primary: colors.blue.darken2,
accent: colors.grey.darken3,
secondary: colors.amber.darken3,
info: colors.teal.lighten1,
warning: colors.amber.base,
error: colors.deepOrange.accent4,
success: colors.green.accent3,
themes: {
dark: {
primary: '#21CFF3',
accent: '#FF4081',
secondary: '#ffe18d',
success: '#4CAF50',
info: '#2196F3',
warning: '#FB8C00',
error: '#FF5252'
},
light: {
primary: '#1976D2',
accent: '#e91e63',
secondary: '#30b1dc',
success: '#4CAF50',
info: '#2196F3',
warning: '#FB8C00',
error: '#FF5252'
}
}
}
},
/*
** Build configuration
*/
build: {
/*
** You can extend webpack config here
*/
publicPath: process.env.PUBLIC_PATH || '/_nuxt/',
extend(config, ctx) {
// config.module.rules.push({
// test: /\.(txt|csv|conll|jsonl)$/i,
// loader: 'file-loader',
// options: {
// name: '[path][name].[ext]'
// }
// })
config.module.rules.push({
enforce: 'pre',
test: /\.(txt|csv|json|jsonl)$/,
loader: 'raw-loader',
exclude: /(node_modules)/
})
config.module.rules.push({
test: /\.(ogg|mp3|wav|mpe?g)$/i,
loader: 'file-loader',
options: {
name: '[path][name].[ext]'
}
})
},
}
}
回答:
在nuxt.config.js配置中间件即可实现,具体参照nuxt文档
https://www.nuxtjs.cn/guide/r...
以上是 nuxt如何修改默认首页? 的全部内容, 来源链接: utcz.com/p/936783.html