Vue-cli3 项目配置 Vue.config.js

Betta 发布于2019-08-23 10:26 / 1249人阅读

摘要：搭建的项目界面想对之前较为简洁之前的和文件夹不见了，那么应该如何配置如等的配那只需要在项目的根目录下文件是根目录，不是目录语法基本路径输出文件目录是否在保存的时候检查配置配置项生产环境是否生成文件相关配置是否使用分离插件

Vue-cli3 搭建的项目界面想对之前较为简洁

之前的build和config文件夹不见了，那么应该如何配置 如webpack等的配那只需要在项目的根目录下vue.config.js
文件（是根目录，不是src目录

语法

module.exports = {
 // 基本路径
 baseUrl: "/",
 // 输出文件目录
 outputDir: "dist",
 // eslint-loader 是否在保存的时候检查
 lintOnSave: true,
 // use the full build with in-browser compiler?
 // https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only
 compiler: false,
 // webpack配置
 // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
 chainWebpack: () => {},
 configureWebpack: () => {},
 // vue-loader 配置项
 // https://vue-loader.vuejs.org/en/options.html
 vueLoader: {},
 // 生产环境是否生成 sourceMap 文件
 productionSourceMap: true,
 // css相关配置
 css: {
  // 是否使用css分离插件 ExtractTextPlugin
  extract: true,
  // 开启 CSS source maps?
  sourceMap: false,
  // css预设器配置项
  loaderOptions: {},
  // 启用 CSS modules for all css / pre-processor files.
  modules: false
 },
 // use thread-loader for babel & TS in production build
 // enabled by default if the machine has more than 1 cores
 parallel: require("os").cpus().length > 1,
 // 是否启用dll
 // See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#dll-mode
 dll: false,
 // PWA 插件相关配置
 // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
 pwa: {},
 // webpack-dev-server 相关配置
 devServer: {
  open: process.platform === "darwin",
  host: "0.0.0.0",
  port: 8080,
  https: false,
  hotOnly: false,
  proxy: null, // 设置代理
  before: app => {}
 },
 // 第三方插件配置
 pluginOptions: {
  // ...
 }
}

举例

上图内容做了两块内容，经测试没有问题

1.将启动端口设置为 8080

2.设置路径别名

云服务器 GPU云服务器 vue-cli3 vue-cli linux配置项目 java项目配置环境

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/96347.html

如何配置 vue-cli 3.0 的 vue.config.js

摘要：那么，我们该如何去配置自己的项目了其实这一切都是因为的项目初始化，帮开发者已经解决了，甚至绝大部分情形下的配置。 vue-cli 3 英文文档vue-cli 3 中文文档webpack 4 pluginswebpack-chain TLDR vue-cli 3 与 2 版本有很大区别 vue-cli 3 的 github 仓库由原有独立的 github 仓库迁移到了 vue 项目下 ...

xuweijian 2019-08-29 16:28 评论0 收藏0
如何配置 vue-cli 3.0 的 vue.config.js

摘要：那么，我们该如何去配置自己的项目了其实这一切都是因为的项目初始化，帮开发者已经解决了，甚至绝大部分情形下的配置。 vue-cli 3 英文文档vue-cli 3 中文文档webpack 4 pluginswebpack-chain TLDR vue-cli 3 与 2 版本有很大区别 vue-cli 3 的 github 仓库由原有独立的 github 仓库迁移到了 vue 项目下 ...

UsherChen 2019-08-26 12:18 评论0 收藏0
如何配置 vue-cli 3.0 的 vue.config.js

摘要：那么，我们该如何去配置自己的项目了其实这一切都是因为的项目初始化，帮开发者已经解决了，甚至绝大部分情形下的配置。 vue-cli 3 英文文档vue-cli 3 中文文档webpack 4 pluginswebpack-chain TLDR vue-cli 3 与 2 版本有很大区别 vue-cli 3 的 github 仓库由原有独立的 github 仓库迁移到了 vue 项目下 ...

ZoomQuiet 2019-08-02 11:20 评论0 收藏0
vue-cli3简单使用配置

摘要：下载安装，这里我使用安装如果已经安装之前版本或需要先卸载，再安装新的版本。还给出了多页面的配置选项，这比之前配置多页面要方便的多。接下来需要在里面进行多页面的配置。 1.下载安装vue-cli3，这里我使用npm安装 npm install -g @vue/cli 如果已经安装之前版本（1.x或2.x）需要先卸载，再安装新的版本。安装完成后可以通过vue --version命令查看版本...

xavier 2019-08-23 12:02 评论0 收藏0
【vue-cli 3.0】 vue.config.js配置 - 路径别名

摘要：如何配置中的路径别名前段时间更新电脑重装了一下，发现了已经更新到版。那么怎么在中配置路径别名呢创建项目在根目录下新建修改之所以用，是因为偷了个懒利用中中已经配好的路径有兴趣的可以进入文件里面看一看参考文档相关简单的配置方式如何配置vue-cli 3中vue.config.js的路径别名？前段时间更新电脑重装了一下vue-cli，发现了vue-cli已经更新到3.0版。用来搭建项目后...

Crazy_Coder 2019-08-23 11:27 评论0 收藏0
【vue-cli 3.0】 vue.config.js配置 - 路径别名

摘要：如何配置中的路径别名前段时间更新电脑重装了一下，发现了已经更新到版。那么怎么在中配置路径别名呢创建项目在根目录下新建修改之所以用，是因为偷了个懒利用中中已经配好的路径有兴趣的可以进入文件里面看一看参考文档相关简单的配置方式如何配置vue-cli 3中vue.config.js的路径别名？前段时间更新电脑重装了一下vue-cli，发现了vue-cli已经更新到3.0版。用来搭建项目后...

cikenerd 2019-08-02 11:19 评论0 收藏0