资源定位

静态资源引用

模板中引用静态资源，不能直接将资源的路径写在模板中，而是要通过js中require该静态资源得到变量，在模板中引用该变量。该路径会根据项目配置的publicPath自动替换成正确路径。利用该功能可以实现静态资源开发路径和部署路径之间的分离，开发者只需要写相对路径，线上可以通过设置publicPath指定任意路径。

  1. <template>
  2. <!-- 
  3. 错误形式
  4. <image src="./assets/logo.png" /> 
  5. -->
  6. <!-- 正确形式 -->
  7. <image src="{{imgPath}}" />
  8. </template>
  9. <script>
  10. class Index {
  11.   data = {
  12.     imgPath: require("./assets/logo.png")
  13.   }
  14. };
  15. export default new Index();
  16. </script>

图片base64

支持在引用图片url后面添加inline参数，以指定图片的base64格式，例如：

  1. <script>
  2. class Index {
  3.   data = {
  4.     imgPath: require("./assets/logo.png?__inline")
  5.   }
  6. };
  7. export default new Index();
  8. </script>