解决JS文件引用路径多层查找

罗志环发布于2019-08-23 12:18 / 2637人阅读

摘要：但是在下编辑有点问题智能路径提示不能用了解决方案添加定位模块解决方案使用插件然后使用相当于

一问题

路径结构 0

如过0-1-2-0-0里面的文件引用0-2-0里面的文件：
（1）相对路径写法

../../../../0-2/0-2-0/file

(2)绝对路径写法

/0-2/0-2-0/file

使用相对路径引用每次引用都要花费精力写很长的路径查找；
而使用绝对路径会有安全性的问题（test）

二解决方案

1. webpack alias

module.exports={
...
  resolve: {
    alias: {
      src: path.resolve(__dirname,"./src"),
    },
  },
...
}

Question:
如果使用了ESlit,ESlint无法识别你自定义的路径变量，会报错
2.解决ESlint报错：
使用 eslint-import-resolver-webpack，告诉eslint，使用webpack的resolver来检查package是否引用正确

1.安装

npm install eslint-import-resolver-webpack  --save

2.修改.eslintrc
配置示例：

module.exports = {
   // ...
   // eslint-import-resolver-webpack 让eslint，使用webpack的resolver来检查package是否引用正确
   settings: {
       "import/resolver": "webpack",
   },
 };

alias同样会有在IDE中无法定位函数和模块的问题等智能提示无法使用的问题
更过配置请参考：eslint-import-resolver-webpack
3.智能路径提示
现在路径变量已经能正常工作了。但是在IDE下编辑有点问题：
（1）智能路径提示不能用了
解决方案：vscode jsconfig.json
jsconfig.json：https://code.visualstudio.com...

添加jsconfig.json

{
    "compilerOptions": {
        "target": "es6",
        "baseUrl": ".",
        "paths": {
            "src": ["./src/*"],
        }
    },
    "include": [
        "src/**/*",
    ]
}

4.定位模块
解决方案：使用VScode插件Path Intellisense
https://marketplace.visualstu...

5.然后使用 "src/utils" 相当于 "/src/utils"

混合云超融合服务器 php中引用文件路径 js 查找文件 js文件引用js js文件引用重复

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/98277.html

node模块加载层级优化

摘要：环境变量法通过上一节的源码分析，我们知道了的作用，那么如何使用或者优雅的使用来解决依赖加载问题呢尝试一最为直接的是，修改系统的环境变量。模块加载痛点大家也或多或少的了解node模块的加载机制，最为粗浅的表述就是依次从当前目录向上级查询node_modules目录，若发现依赖则加载。但是随着应用规模的加大，目录层级越来越深，若是在某个模块中想要通过require方式以依赖名称或相对路...

eccozhou 2019-08-20 12:21 评论0 收藏0
Node.js模块化机制原理探究

摘要：要想让模块再次运行，必须清除缓存。用户自己编写的模块，称为文件模块。并且和指向了同一个模块对象。模块路径这是在定位文件模块的具体文件时指定的查找策略，具体表现为一个路径组成的数组。前言 Node应用是由模块组成的，Node遵循了CommonJS的模块规范，来隔离每个模块的作用域，使每个模块在它自身的命名空间中执行。 CommonJS规范的主要内容：模块必须通过 module.exp...

aikin 2019-08-20 14:20 评论0 收藏0
RequireJS学习笔记

摘要：如果有疑惑的地方，欢迎讨论，我是初学，希望能切磋和得到指点加载会阻塞页面加载默认异步加载文件方法一把放到页面底部加载方法二支持定义全局相对路径方法一自定义属性指定网页程序的主模块文件定义整个网页代码的入口文件的相对位置，以后此文件如果有疑惑的地方，欢迎讨论，我是初学，希望能切磋和得到指点； js加载会阻塞页面加载： //requirejs默认异步加载js文件；方法一...

hersion 2019-08-19 18:01 评论0 收藏0
Nodejs模块加载与ES6模块加载实现

摘要：以后需要引用模块的变量函数类就在这个模块对象的取出，即使再次进来模块也不会重新执行，只会从缓存获取。所以对相同模块的再次加载都是优先缓存方式，核心模块的缓存检查依然优先于文件模块。内建模块导出启动会生成全局变量，提供方法协助加载内建模块。原始时代作为一门语言的引入代码方式，相较于其他如PHP的include和require，Ruby的require，Python的import机制，...

陈江龙 2019-08-26 10:38 评论0 收藏0