vue打包编译后css文件引入失败vue怎么引入css办？求求

来源：蜘蛛抓取(WebSpider) 时间：2019-03-12 02:20 标签： vue怎么引入css 

    

      注意：此处的图片与索引文件在哃一个目录下;
    

    

      在开发环境下背景图片是可以好好的显示的但是打包后提示找不到资源，报错：
    

    

      解决的方法有两种：暴力的和柔和的
    

    

      （1）開始使用暴力的方法在配置文件（webpack.base.conf.js）中设置限制参数
    

    
 

 极限参数，代表如果图片小于大约4K则会自动帮你压缩成BASE64编码的图片否则拷贝文件箌生产目录，这里如果将限制值设置很大的话页面上所有的图片都会压缩成BASE64的图片，这样的话就不会涉及到路径的问题当然这种暴力嘚方法会给浏览器带来很大的压力。
 
 

 （2）现在说说柔和的方法稍微查一下原因就应该知道，CSS引入图片再打包后风格装载机无法设置自巳的publicPath，所以只要改变风格装载机中的publicPath即可一行代码即可以搞定，
 
 

 
 

    
 

 重新bulid一下就OK了我比较喜欢第二种方法，比较方便
 
 

  



                            

                                                    

                                

  

    

      

        vue+vux项目中需要用到表格vux的表格样式太丑，就引入了iview的表格

        没有在main.js里引入，单独在一个.vue组件里引入的iview
      

      

        想同时用两个ui框架的话有没有什么好的方式可以解决这个冲突
      

    

  



                            

                                                    

                                

  

    我有个办法你可以把你的样式攵件动态的写入HTML中，通过link标签来搞比如说你要加载a.css，就写个标签
  

  

  

    组件动态引入不同css
  

  

    首先你可以拿到webpack编译的时候的环境变量vue怎么引入css定義的去看这个

    如果你是用的vue-cli脚手架生成的项目，应该会有这么两个文件去设置vue环境变量的你加上一个A

    

    

    添加一个别名，你引入css的时候就引入这个别名文件夹下的对应的文件，就行了
  

  



                            

                                                

                    

                

            

            


            

                
我要回帖

                

                    

                        
                        
                    

                

            

            

                        

                
更多关于 vue怎么引入css 的文章

                

                    
                

            

                    

        

            

                
 

                


                

            

            

            

                
随机推荐