问答

前端JS import语句必须加.js后缀吗?

作者:admin 2021-04-30 我要评论

初学前端 我想使用一个模块 @tensorflow-models/handpose, 我首先 yarn add @tensorflow-models/handpose 之后在index.js引用这个模块, import * as handpose f...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

初学前端 我想使用一个模块 @tensorflow-models/handpose,
我首先 yarn add @tensorflow-models/handpose
之后在index.js引用这个模块,
import * as handpose from '@tensorflow-models/handpose';
报错:

Uncaught TypeError: Failed to resolve module specifier "@tensorflow-models/handpose". Relative references must start with either "/", "./", or "../".

于是我改为
import * as handpose from './node_modules/@tensorflow-models/handpose/dist/index';
这时候报错

net::ERR_ABORTED 404 (Not Found)

改为import * as handpose from './node_modules/@tensorflow-models/handpose/dist/index.js';
不再报找不到这个文件。但是由于模块的index.js也引用了其他的js文件,其他的js文件又有import xx form xx 的句子(没有.js后缀)
难道只能一个个改过去加上.js后缀吗?实在是太多了。

###
  1. 浏览器端 import 语句后面加的是 url,只要这个 url 返回的是 js 模块就可以正常加载。url 不存在后缀之说,当然大部分时候资源在静态服务器上托管,url 末尾通常是资源的文件路径,所以大概率 .js 结尾。
  2. nodejs 端 import 语句后面接的是模块标识符,一般是 node module 模块名,也可以是 js 文件的路径。nodejs 模块查找有一套自己的逻辑,其中还涉及 package.json 的概念,有兴趣可以深入了解。
  3. 现在的前端项目大概率都会使用构建打包工具,你的import 语句会被构建工具处理,这意味着 import 后面的东西只要是构建工具能理解的就可以,构建工具再把它转化成目标平台(浏览器或者nodejs)能理解的意思。所以你会看到 import 省略后缀的,直接 import 到目录的,面向浏览器项目也能用 import npm 包的,甚至 import 一个非 js 模块比如一张图片,一个 css 文件的。当然他们最终会转化成浏览器能理解的import,也可能直接合并成一个模块import都消失了。

如果你没有用构建工具,参考第一条。

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • 从github上clone代码后文件不显示绿勾

    从github上clone代码后文件不显示绿勾

  • 父组件中循环子组件,子组件$emit触发A

    父组件中循环子组件,子组件$emit触发A

  • 在实现bind函数时,源码中的instanceof

    在实现bind函数时,源码中的instanceof

  • go group并发执行

    go group并发执行

腾讯云代理商
海外云服务器