zoukankan      html  css  js  c++  java
  • vue 用别名取代路径引用

    在项目开发过程中有可能很多包是没有放在npm上的,许多包需要下载到本地引用,这样一来我们只能通过require的方式来引用文件,但是路径的名字就会很长

    例如

    import Select from '../../bower_commonents/bootstrap-select/dist/js/select'

    这种引用方式违背了CommonJS的编程规范,这些长路径我们可以通过webpack的resolve 配置项来解决。

    在weboack.base.config.js中加入以下别名的定义:

    module.exports = {
      context: path.resolve(__dirname, '../'),
      entry: {
        app: './src/main.js'
      },
      output: {
        path: config.build.assetsRoot,
        filename: '[name].js',
        publicPath: process.env.NODE_ENV === 'production'
          ? config.build.assetsPublicPath
          : config.dev.assetsPublicPath
      },
      resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
          'vue$': 'vue/dist/vue.esm.js',
          '@': resolve('src'),
          'bs-select': 'bower_components/bootstrap-select/dist/js/selsect.js'
        }
      }
    }

     有了上面的这个定义之后,我们就可以把之前的引用改为

    import Select from 'bs-select'
  • 相关阅读:
    网页字体设置你了解吗?
    CSS 定位 (Positioning)
    常用CSS缩写语法总结
    CSS 教程
    CSS Reset(CSS重置)
    边框模拟小三角形
    CSS sprites
    border:none和border:0的区别
    css display属性
    css的postion属性
  • 原文地址:https://www.cnblogs.com/ralapgao/p/9869456.html
Copyright © 2011-2022 走看看