vue 脚手架修改默认配置

要点:

 在vue.config.js里配置lintOnSave :false关闭语法检查

 

 

如果修改mian.js的名字就会报错

这是因为在webpack ===>创建中有webpage.config.js,进行了相关的配置

 

对其文件进行打开,并搜main.js

index.html 

 而且在这文件里修改了也没用,只是用来修改的

下图红色框文件名不能改,粉色框可以改

 在vue官网cli配置

可以看到的就可以改

 

 修改方法:创建与webpage.json同级的vue.config.js

 

这边要区分,红色框的是对vue运行的调整

而绿色框则是对脚手架的调整 

 

page一般都是对一些入口的修改

复制到vue.config.js文件上,发现这边使用的是common暴露,因为webpage写node.js使用的就是common暴露,所以,其实就是把要修改的内容写在vue.config.js文件上,之后脚手架会让它和核心的配置文件对比,进行修改,保护核心配置文件的安全性。

 

 然后我们验证:

修改入口路径,而且当修改了vue.config.js文件后,必须对项目进行重新启动, npm run serve才行

启动成功

 :

注:

但是千万不要在里面一个配置项都不写,或者注释掉也不行,否则就会报错

语法检查

只要一开始创建项目的时候,配置了eslint就会有自动检查语法,如果定义了一个方法或者变量等等不用也会报错

eslint jslint jshint就是用于语法检查的

 怎么把它关闭

 使用intOnSave

在vue.config.js里配置lintOnSave :false关闭语法检查

 

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
Vue3的脚手架工具是Vue CLI 4.x,它提供了一些默认配置,也可以通过配置文件进行自定义配置配置文件主要包括: - vue.config.js:用于项目构建时的配置文件,比如修改webpack配置配置代理、配置插件等。 - babel.config.js:用于Babel转码的配置文件。 - postcss.config.js:用于PostCSS的配置文件。 下面是一个基本的vue.config.js配置: ```javascript module.exports = { // 基本路径 publicPath: '/', // 输出文件目录 outputDir: 'dist', // webpack-dev-server 相关配置 devServer: { // 设置代理 proxy: { '/api': { target: '<url>', ws: true, changeOrigin: true }, '/foo': { target: '<other_url>' } } }, // eslint-loader 是否在保存的时候检查 lintOnSave: true, // 是否使用包含运行时编译器的 Vue 构建版本 runtimeCompiler: false, // 生产环境是否生成 sourceMap 文件 productionSourceMap: true, // css相关配置 css: { // 是否分离css(插件ExtractTextPlugin) extract: true, // 是否开启 CSS source maps sourceMap: false, // css预设器配置项 loaderOptions: { css: {}, postcss: {} }, // 是否启用 CSS modules for all css / pre-processor files. modules: false }, // webpack配置 configureWebpack: { // 关闭 webpack 的性能提示 performance: { hints: false } }, // webpack链式操作 chainWebpack: () => {}, // 配置高于chainWebpack中关于 css loader 的配置 css: { loaderOptions: { css: { // 这里的选项会传递给 css-loader }, postcss: { // 这里的选项会传递给 postcss-loader } } }, // 所有 webpack-dev-server 的选项都支持 devServer: { proxy: { '/api': { target: '<url>', ws: true, changeOrigin: true }, '/foo': { target: '<other_url>' } } }, // 是否为 Babel 或 TypeScript 使用 thread-loader parallel: require('os').cpus().length > 1, // 向 PWA 插件传递选项 pwa: {}, // 可以用来传递任何第三方插件选项 pluginOptions: {} } ``` 需要注意的是,如果是在vue-cli 3.x升级到vue-cli 4.x,需要将原来的配置文件中的内容迁移到新的配置文件中。同时,新的vue.config.js中取消了baseUrl选项,改用publicPath选项来配置基本路径。
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值