当先锋百科网

首页 1 2 3 4 5 6 7

Vue 脚手架是一个快速构建 Vue 应用程序的工具。在构建过程中,开发者需要经常在脚手架中进行一些配置。本文将介绍一些常用的 Vue 脚手架配置。

1、打包配置

// 在 config/index.js 中
build: {
// 生成环境的文件路径
assetsRoot: path.resolve(__dirname, '../dist'),
// 打包的资源路径
assetsPublicPath: '/',
// js 文件名称 
filename: '[name].js',
}

2、使用全局样式

// 在 main.js 中
import '@/assets/styles/index.scss'

3、引入第三方库

// 在 webpack.base.conf.js 中
module.exports = {
entry: {
app: './src/main.js',
vendor: ['vue', 'vue-router']
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: 'vendor',
minChunks: Infinity
})
]
}

4、配置代理

// 在 config/index.js 中
dev: {
// ...
proxyTable: {
'/api': {
target: 'http://localhost:3000',
pathRewrite: { '^/api': '' }
}
}
}

5、允许跨域

// 在 config/index.js 中
dev: {
// ...
headers: {
'Access-Control-Allow-Origin': '*'
}
}