nodejs中使用別名映射,兼容webpack的@和best-require 的:xxx 別名映射

項目地址: https://github.com/langyuxiansheng/biu-server-admin



寫在前面

研究了很久,找了很多資料發(fā)現(xiàn)都沒有,只好自己去想辦法,查資料.才弄好的,凌晨發(fā)布的,轉(zhuǎn)載請注明出處.

在做nodejs項目開發(fā)的時候,你是不是也在為

require('./posts');

require('./controllers/posts');

require('../controllers/posts');

require('../../controllers/posts');

require('../../../apis/controllers/posts');



或者



require(ROOT_PATH + '/application/apis/controllers/posts');

// other require()...

require(ROOT_PATH + '/application/apis/controllers/users');

require(ROOT_PATH + '/application/apis/controllers/products');

require(ROOT_PATH + '/application/apis/services/rest');

require(ROOT_PATH + '/application/apis/config');



這樣的寫法而困擾;



那看完這篇文章,從此之后就可以告別這個煩惱了;



感謝一下 best-require 這個模塊包的作者,不然還需要自己去寫這個

npmjs 鏈接 https://www.npmjs.com/package/best-require

github 鏈接 https://github.com/yuezhihan/best-require



不廢話了,進入正題 往下看:

1. 安裝庫 best-require 進行別名映射
   
   
   
   
   
   npm i best-require --save
   
   
   
2. 映射別名. 實例在本項目中 server/index.js 中
   
   
   
   
   
   const path = require('path');
   
   const ROOT_PATH = process.cwd();
   
   const SRC_PATH = path.join(ROOT_PATH, /server/src);
   
   console.log(ROOT_PATH, SRC_PATH);
   
   //映射目錄別名
   
   require('best-require')(ROOT_PATH, {
   
       root: ROOT_PATH,
   
       src: SRC_PATH,
   
       controllers: path.join(SRC_PATH, '/controllers'),
   
       models: path.join(SRC_PATH, '/models'),
   
       routes: path.join(SRC_PATH, '/routes'),
   
       crawlers: path.join(SRC_PATH, '/crawlers'),
   
       services: path.join(SRC_PATH, '/services'),
   
       middleware: path.join(SRC_PATH, '/middleware'),
   
       lib: path.join(SRC_PATH, '/lib'),
   
       config: path.join(SRC_PATH, '/config'),
   
       logs: path.join(SRC_PATH, '/logs')
   
   });
   
   
   
   //運行服務(wù)
   
   require('./src/bin/Server').run();
   
   
   
3. 設(shè)置 jsconfig.json
   
   
   
   
   
   {
   
       "compilerOptions": {
   
           "allowSyntheticDefaultImports": true,
   
           "baseUrl": "./",
   
           "paths": {
   
               "@/": ["client/"],
   
               ":root/": [""],
   
               ":config/": ["server/src/config/"],
   
               ":lib/": ["server/src/lib/"],
   
               ":services/": ["server/src/services/"],
   
               ":controllers/":["server/src/controllers/"],
   
               ":models/": ["server/src/models/"],
   
               ":routes/": ["server/src/routes/"],
   
               ":crawlers/": ["server/src/crawlers/"],
   
               ":middleware/": ["server/src/middleware/"],
   
               ":logs/": ["server/src/logs/"]
   
           }
   
       },
   
       "include": ["server/*/","client/*/"],
   
       "exclude": [
   
           "node_modules",
   
           "nuxt-dist",
   
           "server-dist"
   
       ]
   
   }
   
   
   
4. vscode要安裝 path-intellisense 插件 并在設(shè)置中配置setting.json
   
   
   
   vscode 中的設(shè)置,setting.json
   
   
   
   workspaceRoot 是當(dāng)前的工作空間,就是當(dāng)前編輯器打開的目錄.
   
   
   
   配置如下
   
   
   
   
   
   {
   
       "path-intellisense.mappings": {
   
           "@": "${workspaceRoot}/client",
   
           ":root": "${workspaceRoot}",
   
           ":lib": "${workspaceRoot}/server/src/lib",
   
           ":controllers": "${workspaceRoot}/server/src/controllers",
   
           ":models": "${workspaceRoot}/server/src/models",
   
           ":routes": "${workspaceRoot}/server/src/routes",
   
           ":crawlers": "${workspaceRoot}/server/src/crawlers",
   
           ":services": "${workspaceRoot}/server/src/services",
   
           ":middleware": "${workspaceRoot}/server/src/middleware",
   
           ":config": "${workspaceRoot}/server/src/config",
   
           ":logs": "${workspaceRoot}/server/src/logs",
   
       }
   
   }
   
   
   
5. 重啟vscode,試試看吧!
   
   作者的目錄結(jié)構(gòu)
   
   
   
   
   
   
   
   
   
   vue中使用
   
   
   
   
   
   
   
   后續(xù)更新
   
   nodejs中使用sequelize的model映射,這樣就解決了沒得提示的煩惱了,讓你的效率提升2個檔次
   
   寫在后面
   
   如果你遇到難題或者有疑問,有好的建議請留言反饋.
   
   這種提示以及Ctrl + 鼠標左鍵的跳轉(zhuǎn),只針對 .js 的文件, .vue的沒試過.這個也只是為了解決 js方法映射后沒提示的問題.