简述vue中的config配置

在webpack.base.conf文件中配置别名以及扩展名

resolve: {
  extensions: ['.js', '.vue', '.json', '.styl'],
  alias: {
   'vue$': 'vue/dist/vue.esm.js',
   '@': resolve('src'),
   'src': path.resolve(__dirname, '../src'),
   'common': path.resolve(__dirname, '../src/common'),
   'components': path.resolve(__dirname, '../src/components')
  }
 }

配置好别名和扩展名后，main.js就可以这样写

import Vue from 'vue';
import App from './App';
import Router from 'vue-router';
//components前面可以加上'@/'，也可以省略不写
//如果没有别名，就要写成“import goods from '../components/goods/goods';“
import goods from 'components/goods/goods';
import seller from 'components/seller/seller';
import ratings from 'components/ratings/ratings';
import '@/common/stylus/index';

总结

以上所述是小编给大家介绍的vue中的config配置，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

您可能感兴趣的文章:

  • vue-cli配置文件——config篇
赞 (0)

相关推荐

  • vue-cli配置文件——config篇

    最近一直在研究webpack,突然想看看vue-cli中的webpack是如何配置,查阅了很多相关的文章,所以也想出几篇关于vue-cli配置的东西.正所谓"工欲善其事必先利其器"嘛!这一篇主要是分析vue中关于 config文件夹中的相关代码 : 首先我们先看一下config的文件结构: |-config |---dev.env.js |---index.js |---prod.env.js 打开我们的vue项目文件夹我们可以清楚的看到文件夹下的三个文件, "dev.env

  • 简述vue中的config配置

    在webpack.base.conf文件中配置别名以及扩展名 resolve: { extensions: ['.js', '.vue', '.json', '.styl'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src'), 'src': path.resolve(__dirname, '../src'), 'common': path.resolve(__dirname, '../src/common'), 'compo

  • 详解axios在vue中的简单配置与使用

    一.axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征: 从浏览器中创建 XMLHttpRequest 从 node.js 发出 http 请求 支持 Promise API 拦截请求和响应 转换请求和响应数据 取消请求 自动转换JSON数据 客户端支持防止 CSRF/XSRF 二.引入方式: npm: $ npm install axios //淘宝源 $ cnpm install axios bower: $ bowe

  • Vue中的Vux配置指南

    简介 Vux(读音 [v'ju:z],同views)是基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面. 基于webpack+vue-loader+vux可以快速开发移动端页面,配合vux-loader方便你在WeUI的基础上定制需要的样式. vux-loader保证了组件按需使用,因此不用担心最终打包了整个vux的组件库代码. vux并不完全依赖于WeUI,但是尽量保持整体UI样式接近WeUI的设计规范.最初目标是创建一个易用,实用,美观的移动端UI组件库,现在离理想状

  • 解决vue中使用proxy配置不同端口和ip接口问题

    问题描述: 使用vue-cli创建的项目,开发地址是localhost:8080,由于后台开发不同的模块,导致每个模块请求的ip和端口号不一致 例如:http://192.168.10.22:8081  或者 http://192.168.10.30:9999等 解决问题: 在vue.config.js中配置不同的端口号 module.exports = { publicPath: process.env.NODE_ENV === 'production' ? './' : '/', devSe

  • vue中使用typescript配置步骤

    vue中使用typescript配置步骤

    目录 1.vue老项目引入TypeScripe 从零开始创建vue+typescript项目 通过前端各个框架的发展,例如vue3.0,react和angular等框架的源码都是用ts(typescript)进行编写的,因此我感觉未来的中大型项目的发展趋势也离不开ts.因此我根据一些入门教程利用vue结合ts编写了文档,适合入门配置vue+ts项目. 1.vue老项目引入TypeScripe npm install vue-class-component vue-property-decorat

  • vue中接口域名配置为全局变量的实现方法

    src中新建 一个 domain.js文件 // 配置全局接口域名 const domain = 'http://bowensi.xiaoniren.cn/'; export default { testUrl:domain } main.js中 import domain from './domain.js'; global.domain = domain; 组件中: data () { return { imgsrc:domain.testUrl}} 以上这篇vue中接口域名配置为全局变量的

  • Vue中使用vux配置代码详解

    一.根据vux文档直接安装,无需手动配置 npm install vue-cli -g // 如果还没安装 vue init airyland/vux2 my-project // 创建名为 my-project 的模板 cd my-project // 进入项目 npm install --registry=https://registry.npm.taobao.org // 开始安装 npm run dev // 运行项目 二.想在已创建的Vue工程里引入vux组件 <1>. 在项目里安装

  • vue中使用ts配置的具体步骤

    目录 vue老项目引入TypeScripe 从零开始创建vue+TypeScripe项目 vue3加ts的配置与基本语法格式 下面是我写的一个小demo 通过前端各个框架的发展,例如vue3.0,react和angular等框架的源码都是用ts(TypeScripe)进行编写的,因此我感觉未来的中大型项目的发展趋势也离不开ts. 因此我根据一些入门教程利用vue结合ts编写了文档,适合入门配置vue+ts项目. vue老项目引入TypeScripe npm install vue-class-c

  • vue中rem的配置的方法示例

    vue中rem的配置的方法示例

    在用vue或react等工具搭建一个移动端项目时,怎样做到自适应呢? 当然选择rem布局比较方便快捷. 开发移动端,我们常常要用到rem+flex,那么vue中如何配置呢,我的做法是这样: 1.在js中统一计算配置 代码如下: export default function() { // var devicePixelRatio = 1; // var scale = 1 / devicePixelRatio; // document.querySelector('meta[name="view

  • Vue中的ESLint配置方式

    Vue中的ESLint配置方式

    目录 说说Vue项目中添加ESLint的规则 第一步:安装 第二步:配置.eslintrc文件 第三步:如图配置 用惯了组里统一的代码风格,再看默认的vue项目代码很是别扭,记录下ESLint配置,以后直接copy paste,美滋滋 官网:https://eslint.org/docs/rules/ ESLint配置方式 ESLint有三种配置方式,一般自定义规则较少时,选第2种:自定义配置很多,建议第1种:第3种常用于对某句代码禁用eslint. 1.在package.json中通过esli

随机推荐