在vue中赋值的路径没有被编译

最新推荐文章于 2023-08-11 17:05:10 发布
最新推荐文章于 2023-08-11 17:05:10 发布
阅读量99 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/davidcdh/p/7385702.html
版权

当我们跑起来的时候，f12会看到相对路径，但是此时会报错，说找不到图片，这时候有其中一个办法，直接

require进去。

 

 
 
 这时候就可以成功显示图片，但是路径会不一样，因为编译出来。
 
 
 
 
至于如何props进去呢，待定
 
 
 
 

 

转载于:https://www.cnblogs.com/davidcdh/p/7385702.html

                

        

        




    




    

      

        

            

              
                
                  weixin_30721077
                
              
            

            

                关注
              
            

        

        

          
    
            
  • 
              
                
                
                
                
                      0
                
              
              
    点赞
    
            
    • 
            
  • 
              
                
                
                
              
              
    踩
    
            
    • 
            
  • 
              
                
                
                
                
                    0
                
              
              
    
                
    
                  
                    收藏
                  
                
    
              
    
              
    
                
    
                  觉得还不错?
                  
                    一键收藏
                  
                 
                
    
              
    
            
    • 
          
  • 
            
    
              
              
            
    
              
              
              
                    0
              
            
            
    评论
    
          
    • 
          
  • 
          
    • 
          
  • 
            
              
            
              
    
            
              
                
            
    
          
    • 
        

      

      










                



	

		

			

				
					
vue解决未编译显示问题

				
			

			

				

					u011013840的博客
				

				

					02-22
					
					1922
					
				

			

		

		

			
				
[v-cloak] {
  display: none;
}
<div v-cloak>
  {{ message }}
</div>

			
		

	



                

              
                



	

		

			

				
					
vscode开发vue项目页面修改保存时不自动编译的问题解决办法

				
			

			

				

					木待成舟的博客
				

				

					12-18
					
					1万+
					
				

			

		

		

			
				
需要注意router文件中引用名必须与文件目录中名称完全一致，区分大小写。

如果大小写不同的话，router依然能成功跳转，但是在文件修改保存时，vscode就不会实时编译了。


			
		

	



                


  
              

                


	

		

			

				
					
解决webstorm 下编写vue代码，保存后不自动打包编译的问题

				
			

			

				

					zhumengzj的博客
				

				

					02-28
					
					2814
					
				

			

		

		

			
				
找到webstorm->settings->Appearance&Behavior->System Setting如下图：不要勾选即可找到webstorm->settings->Appearance&Behavior->System Setting如下图：不要勾选即可...

			
		

	





	

		

			

				
					
vue没有热加载编译

				
			

			

				

					lyxkgc的博客
				

				

					03-24
					
					1076
					
				

			

		

		

			
				
vue没有热加载编译

可能原因：

1. vue 监控文文件 触发 是保存事件。 保存后发现有代码改变就进行重新编译。 因为浏览器只能解析显示编译后的 js css html。

 并不是直接读取vue组件。 但是编译的越频繁，消耗性能越多。 所以，热加载监控文件区域只是 src。 故，main.js pro.js等配置文件修改，并不会触发重新编译。

2. 修改src内的组件，编译失效。 可以npm install 。因为编译本省也是一段js 。 或者是插件，有损坏或者报错的可能。初始化一下...

			
		

	



		

			
		



	

		

			

				
					
新建某个vue文件保存不会自动编译

					
最新发布

				
			

			

				

					Palin的博客
				

				

					08-11
					
					493
					
				

			

		

		

			
				
新建某个vue文件保存不会自动编译

			
		

	





	

		

			

				
					
vue中如何动态绑定图片,vue中通过data返回图片路径的方法

				
			

			

				

					08-28
				

			

		

		

			
				
然而，如果图片路径是从后台API获取的，那么你可能需要在Vue实例的生命周期钩子，如`created`或`mounted`中，通过Ajax请求获取图片路径，然后赋值给`imageUrl`。例如：  ```javascript new Vue({  el: '#app',  data...

			
		

	





	

		

			

				
					
解决vue项目 build之后资源文件找不到的问题

				
			

			

				

					01-19
				

			

		

		

			
				
这就需要修改我们的 config 中的 index.js了，默认的build 中的部分是这样的：   build: {  // Template for index.html  index: path.resolve(__dirname, '../dist/index.html'),  // Paths  assetsRoot: path....

			
		

	





	

		

			

				
					
解决Vue动态加载本地图片问题

				
			

			

				

					10-16
				

			

		

		

			
				
这是因为Vue编译时没有处理相对路径，导致图片资源未能被正确引用。  **解决方案一：全局import图片**  一种解决方法是在组件内部或者在Vue实例的入口文件中，通过`import`语句提前导入所有需要的图片。例如：  ```...

			
		

	





	

		

			

				
					
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决

				
			

			

				

					11-20
				

			

		

		

			
				
动态添加src被当做静态资源处理了，没有进行编译   npm run build 后出现 xxxxxxx net::ERR_FILE_NOT_FOUND  解决办法： 进入：build文件夹 > 打开 webpack.prod.conf.js 找到：output 对象 添加：publicPath：‘./...

			
		

	





	

		

			

				
					
Vue Day6面经基础src文件

				
			

			

				

					08-10
				

			

		

		

			
				
在Vue Day6的面试准备中，src目录是项目的核心部分，包含着应用的所有源代码。理解src目录的结构和其中的文件是掌握Vue开发的关键。  1. **src 文件夹结构**：  - `src` 文件夹通常包含以下主要部分：  - `...

			
		

	





	

		

			

				
					
用vue手脚架生成项目后，修改.Vue文件后，直接保存编译报一大堆错误，解决办法如下

				
			

			

				

					拎着壳儿跑的蜗牛
				

				

					11-20
					
					2370
					
				

			

		

		

			
				
用vue手脚架生成项目后，修改.Vue文件后，直接保存编译报一大堆错误，解决办法如下：
显示错误截图如下：

因为直接用vue脚手架初始化创建项目，会选择是否选用eslint语法检查，选择了之后，修改.vue文件报以上截图错误
解决办法如下：

直接重新初始化关掉eslint语法，但是这样子做的话，有点麻烦。
直接在文件根目录下的.eslintrc.js文件加入如下代码，直接忽略掉就行了  rul...

			
		

	





	

		

			

				
					
Vue 路径地址有变动，但是页面并没有变化原因

				
			

			

				

					起飞芜湖的博客
				

				

					01-12
					
					2676
					
				

			

		

		

			
				
因为模板里没有加<router-view></router-view>


			
		

	





	

		

			

				
					
vue引用本地图片地址遍历无法被浏览器编译解析的问题

				
			

			

				

					qq_37049128的博客
				

				

					06-13
					
					1171
					
				

			

		

		

			
				
前言：由于工作原因，一直没有时间更博，今天就写一下用vue的时候踩过的一些坑

在做项目的过程中，让我印象最深刻的问题有两个：

（1）在同一个页面上重复使用同一个组件的时候，数据源污染，在第二个数据加载的时候把第一个数据源给冲突了的情况

这个问题当时整整搞了两个小时，后来才想到，对象作用域隔离的问题，也就是scope,怎么说呢？也就是你想在同一个页面重复使用同一个组件的时候，那你样式肯定是不一...

			
		

	





	

		

			

				
					
vue运行后没有实时编译解决

				
			

			

				

					lyxkgc的博客
				

				

					11-05
					
					1303
					
				

			

		

		

			
				
写代码时发现，视图没有实时更新。
解决方法：
npm install     // 可能是缺少了插件，无法检测到代码的变动
npm run dev
然后在启动就可以了



			
		

	





	

		

			

				
					
解决Vue不支持运行时编译的问题(...runtime compilation is not supported in this build of Vue...)

				
			

			

				

					月影WEB的博客
				

				

					05-18
					
					3935
					
				

			

		

		

			
				
在Vue开发这种如果遇到以下警告：
[Vue warn]: Component provided template option but runtime compilation is not supported in this build of Vue. Configure your bundler to alias "vue" to "vue/dist/vue.esm-bundler.js".


如下图：
图1





翻译出来的意思是：
[Vue warn]:组件提供模板选项，但在此版本的Vue中.

			
		

	





	

		

			

				
					
vue——静态配置文件不进行编译的处理方法(在public中引入js)

				
			

			

				

					yehaocheng520的博客
				

				

					07-22
					
					3660
					
				

			

		

		

			
				
前几天同事提了一个要求，他想在vue引入静态配置文件，但是此文件不要进行编译。静态配置文件中的参数还需要在其他的.vue文件中使用配置文件中的参数。
我一开始的想法就是：要在src同级目录下，添加几个.env.xxx的配置文件，然后在文件中配置NODE_ENV``NODE_BASE_URL等参数，然后在其他页面就可以通过env.process.xxx的方式来使用了。
但是同时要求不能进行编译，虽然我也不太清楚，编译和不编译对参数有什么影响。
最终方案如下：
1.在public文件中添加同级的static文件

			
		

	





	

		

			

				
					
Vue指定不编译的文件夹和favicon.ico

				
			

			

				

					marko_zheng的博客
				

				

					08-21
					
					3423
					
				

			

		

		

			
				
Vue指定不编译的文件夹和favicon.ico
在Vue3.0中引入public文件夹，不希望被编译的文件都可以放到这个文件夹下，但是在vue2.0中实现类似的功能，需要自己在webpack.prod.conf.js中做一些配置
在这里简单的区分一下Vue2.0中的assets和static的区别
assets:各组件中的依赖项，会被编译
static:不会被编译，原样放到dist文件夹下
言归...

			
		

	





	

		

			

				
					
Vue如何支持JSX语法

					
热门推荐

				
			

			

				

					Yang Yong 的博客
				

				

					07-25
					
					2万+
					
				

			

		

		

			
				
Vue如何支持JSX语法通常开发vue我们使用的是模板语法，其实还有和react相同的语法，那就是render函数，同样支持jsx语法。 
Vue 的模板实际是编译成了 render 函数。1.传统的createElement方法createElement(
  'anchored-heading', {
    props: {
      level: 1
    }
  }, [
    cr

			
		

	





	

		

			

				
					
vue中赋值给input为被选中的状态

				
			

			

				

					07-08
				

			

		

		

			
				
在Vue中，你可以使用v-model指令将数据绑定到input元素，并通过改变数据的值来实现选中状态的赋值。  例如，如果你有一个checkbox输入框，并且想要将选中状态赋值给一个data中的变量，你可以这样做：  ```html      ...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

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

              

            

          

      

      余额充值