vue-cli3及以上创建项目并配置vue.config.js

vue create 项目名

如果想要使用啥就加载啥直接default直接一路Enter就行，简单版，需要啥安装啥就行

 

如果有其他想要安装的可选择Manually select features可选择自己想要

 安装完成之后，npm run serve 就可以

对于跨域和一些基本的配置需要自己配置，在根目录下创建vue.config.js，一些自己的基础配置如下，其他特殊要求可以自己百度加载。

const target = "后台的接口链接"
const port = process.env.port || process.env.npm_config_port || 8080; // 打开时的端口
module.exports = {
    publicPath: "./",  // 访问路径，相对路径不然容易出现白屏
    outputDir: "dist",  // 输出的文件夹
    assetsDir: "static",  // 静态文件的存放闻之
    lintOnSave: false,  // 是否启用esLint
    productionSourceMap: true, // 生产环境文件是是否包含.map文件
    devServer: {
        open: true, // 启动后是否需要自动打开浏览器
        disableHostCheck: true,
        port: port, // 启用后的端口
        headers: {
            "Access-Control-Allow-Origin": "*",
        },
        overlay: {
            warnings: false,
            errors: true,
        },
        proxy: {
            "/": {
                target, // 跨域的链接
                changeOrigin: true, // 是否跨域
                pathRewrite: { // 重写请求链接
                    "^/": ""
                },
            }
        }
    },
    css: {
        // 不用在每一个页面都进行引入样式，就能直接引用。
        loaderOptions: { // sass-loader
            sass: {
                prependData: `@import '@/styles/variables.scss';`,
            },
        },
        sourceMap: true
    },
}