请问 vue 项目 怎么测试 单 js 文件（import 语法 node 执行会出错）
selfcreditgiving · 2020-06-07 00:07:32 +08:00 · 2371 次点击这是一个创建于 1616 天前的主题，其中的信息可能已经有所发展或是发生改变。
是提供给 vue 页面使用的 util 方法的 js 文件。node 版本为 v10.16.3
想测试单个的 util 方法是不是有问题，新建一个测试 js 文件 test.js ，import util 然后手动测试，发现 node 不能使用 import 语法。
会报如下的错误：
import lib from './lib'
^^^
SyntaxError: Unexpected identifier
at Module._compile (internal/modules/cjs/loader.js:723:23)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
Process finished with exit code 1
也附上要测试两个简单的 js 文件，lib.js 和 test.js
lib.js
function add (a, b) {
return a + b
}
export default {
add
}
test.js
import lib from './lib'
lib.add(1, 2)
这个问题一般是怎么解决的呢？
第 1 条附言 · 2020-06-07 05:24:11 +08:00
方法是使用
回复不支持 markdown， 在附言里再添加一下。
找到了一个不算完美的解决方案。
方法是使用 babel-node 来执行 js 文件。
参考文章：Import, Export, Babel, and Node
安装
npm i babel-cli --save-dev
npm i babel-preset-env --save-dev
修改 .babelrc
将.babelrc内容改为如下（ vue 脚手架原有的 .babelrc不能运行，后面再说怎么解决这个冲突 ）
{
"presets": ["env"]
}
使用 babel-node 执行含有 import 的 js 文件
npx babel-node test.js
vue 脚手架 的 .babelrc 改成 babel-node 可以执行的配置会出错，现在说解决冲突的方法：
自己每次手动切换。。。
/*--------------------------- vue 脚手架配置 ---------------------------*/
//{
// "presets": [
// ["env", {
// "modules": false,
// "targets": {
// "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
// }
// }],
// "stage-2"
// ],
// "plugins": ["transform-vue-jsx", "transform-runtime"]
//}
/*--------------------------- 运行 babel-node 时设置如下 ---------------------------*/
{
"presets": ["env"]
}
 |
1
noe132 2020-06-07 00:08:47 +08:00
关键字 commonjs module, esmodule
|
 |
2
selfcreditgiving OP @noe132 #1 我搜网上说 node 9 已经开始支持 import 了，怎么我的 node 10 还不支持呢 https://juejin.im/post/5b87952e6fb9a019e8228aae
|
|
3
selfcreditgiving OP 这个文章说 node 9 版本 要支持 import 还是要把 .js 改为 .mjs
链接： https://segmentfault.com/a/1190000018677932 |
|
4
selfcreditgiving OP 看了一下 stackoverflow， 要把所有用到的 js 文件都改为 .mjs 结尾，这样如果我测试的代码 又引用了其他代码，，， 这样改不太现实啊
https://stackoverflow.com/questions/45854169/how-can-i-use-an-es6-import-in-node |
|
5
selfcreditgiving OP 找到了一个不算完美的解决方案。 要老命了，，，
方法是使用 ``babel-node`` 来执行 js 文件。 参考文章：[Import, Export, Babel, and Node]( https://medium.com/@JedaiSaboteur/import-export-babel-and-node-a2e332d15673) #### 安装 ``` npm i babel-cli --save-dev ``` ``` npm i babel-preset-env --save-dev ``` #### 修改 .babelrc 将``.babelrc``内容改为如下（ vue 脚手架原有的 ``.babelrc``不能运行，后面再说怎么解决这个冲突 ） ``` { "presets": ["env"] } ``` #### 使用 babel-node 执行含有 import 的 js 文件 ``` npx babel-node test.js ``` vue 脚手架 的 ``.babelrc`` 改成 babel-node 可以执行的配置会出错，现在说解决冲突的方法： 自己每次手动切换。。。 ``` /*--------------------------- vue 脚手架配置 ---------------------------*/ //{ // "presets": [ // ["env", { // "modules": false, // "targets": { // "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] // } // }], // "stage-2" // ], // "plugins": ["transform-vue-jsx", "transform-runtime"] //} /*--------------------------- 运行 babel-node 时设置如下 ---------------------------*/ { "presets": ["env"] } ``` |
 |
6
seki 2020-06-07 07:36:01 +08:00  1
直接用 vue-cli 架自带的 test 配置，不用发明自己的一套轮子
|
|
7
selfcreditgiving OP @seki #6 学习了，多谢
|
 |
8
rodjerL 2020-06-08 08:04:42 +08:00 via iPhone
用的 jest 测试？
|
Select Language