Meituan-Dianping/mpvue

【vue-loader】增加对`~`开头资源路径处理

Open

#692 opened on Jun 27, 2018

View on GitHub
 (1 comment) (0 reactions) (0 assignees)JavaScript (20,428 stars) (2,080 forks)batch import
help wantedwontfix

Description

【vue-loader】增加对~开头资源路径处理

问题复现步骤:

无

期望的表现:

以下是 vue-loader 资源路径处理支持情况

编译规则

  • 如果路径以~开头，其后的部分将会被看作模块依赖。这意味着你可以用该特性来引用一个node依赖中的资源：
<img src="~some-npm-package/foo.png">

(13.7.0+) 如果路径以@开头，也会被看作模块依赖。如果你的webpack配置中给@配置了 alias，这就很有用了。所有vue-cli创建的项目都默认配置了将@指向 /src。

如 https://github.com/Meituan-Dianping/mpvue/issues/507#issuecomment-390408563 所诉已经增加对./或../开头资源的处理, 希望增加对~开头资源路径处理。

观察到的表现:

mpvue-loader@1.0.15暂未对~开头资源路径处理

屏幕截图和动态 GIF 图

无

Contributor guide

Tech stack
javascriptvue
Domain
frontendbuild system
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
Understanding of webpack loader configurationBasic knowledge of Vue.js resource handling
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
40
Research direction
Examine the current asset URL handling in mpvue loader, specifically the regex that processes './' and '../' prefixes. Implement support for '~' prefix by treating it as module dependency, similar to how vue loader handles it. Check related issue #507 and comment https://github.com/Meituan Dianping/mpvue/issues/507#issuecomment 390408563 for context on previous additions. The implementation should modify the loader's rule to resolve '~' paths to node modules.