TypeError: Failed to resolve module specifier "@open-wc/testing". Relative references must start with either "/", "./", or "../"

Question

我正在尝试找到一些对我的 vanilla webcomponents 进行单元测试的好方法，我正在尝试这种方法 open-wc 但我遇到了上述错误

我的组件-test.js

import {
  html,
  fixture,
  expect,
} from '@open-wc/testing';
import { MyComponent } from "../src/my-component.js";

describe("simple test", () => {
  it("test", async () => {
    const el = await fixture("<my-component></my-component>");
    expect(el.success).to.be.false;
  });
});

来自package.json

的相关部分

  "scripts": {
    "test": "karma start",
...
  },
  "devDependencies": {
    "@open-wc/testing": "^1.0.14",
    "@webcomponents/webcomponentsjs": "^2.2.0",
    "babel-eslint": "^10.0.2",
    "es-dev-server": "^1.6.3",
    "eslint": "^6.0.1",
    "eslint-config-google": "^0.13.0",
    "karma": "^4.2.0",
    "karma-chrome-launcher": "^3.0.0",
    "karma-jasmine": "^2.0.1",
    "karma-script-launcher": "^1.0.0",
    "karma-spec-reporter": "0.0.32",
    "prettier": "1.18.2",
    "wct-browser-legacy": "^1.0.2",
    "web-component-tester": "^6.9.2"
  },

控制台

# npm test 



> basic-vanilla-webcomponent@ test C:\_d\WSs\basic-vanilla-webcomponent                                                                       
> karma start                                                                                                                                 

16 07 2019 18:57:51.712:INFO [karma-server]: Karma v4.2.0 server started at http://0.0.0.0:9876/                                              
16 07 2019 18:57:51.719:INFO [launcher]: Launching browsers Chrome with concurrency unlimited                                                 
16 07 2019 18:57:51.730:INFO [launcher]: Starting browser Chrome                                                                              
16 07 2019 18:57:54.850:INFO [Chrome 75.0.3770 (Windows 10.0.0)]: Connected on socket Hf1IzCLlm_IaBeZXAAAA with id 12297274                   
Chrome 75.0.3770 (Windows 10.0.0) ERROR                                                                                                       
  An error was thrown in afterAll                                                                                                             
  ReferenceError: require is not defined                                                                                                      
      at node_modules/find-port/test/findPort.test.js:1:16                                                                                    
  ReferenceError: require is not defined                                                                                                      
      at node_modules/registry-auth-token/test/auth-token.test.js:1:10                                                                        
  ReferenceError: require is not defined                                                                                                      
      at node_modules/registry-auth-token/test/registry-url.test.js:1:10                                                                      
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/00-file-stress.test.js:11:12                                                                    
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/01-file-maxsize.test.js:8:16                                                                    
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/console.test.js:11:14                                                                           
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/file-archive.test.js:10:16                                                                      
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/file-tailrolling.test.js:2:16                                                                   
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/file.test.js:3:14                                                                               
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/http.test.js:7:12                                                                               
  ReferenceError: require is not defined                                                                                                      
      at node_modules/winston/test/transports/stream.test.js:3:14                                                                             
  TypeError: Failed to resolve module specifier "@open-wc/testing". Relative references must start with either "/", "./", or "../".           

Chrome 75.0.3770 (Windows 10.0.0): Executed 0 of 0 ERROR (0.02 secs / 0 secs)                                                                 

npm ERR! Test failed.  See above for more details.                                                                                      

已检查版本

# npm list @open-wc/testing
basic-vanilla-webcomponent@ C:\_d\WSs\basic-vanilla-webcomponent
`-- @open-wc/testing@1.0.14

*** 编辑于 2019 年 7 月 22 日

我通过将整个写入路径来更改导入 (import { html, fixture, expect } from "C:/_d/WSs/basic-vanilla-webcomponent/node_modules/@open-wc/testing";) 然后我得到了这个没有多大帮助的错误:

Answer 1

如果 @open-wc 在主 public 文件夹中，您应该尝试添加 ./：

import {
  html,
  fixture,
  expect,
} from './@open-wc/testing';

Answer 2

我遇到了同样的问题，但是在 src 文件夹中指向 tests 没有任何错误。例如

这会给出与您相同的错误

{
   pattern: 'test/**/*.test.js',
   type: 'module'
}

但这很好用

{
   pattern: 'src/**/*.test.js',
   type: 'module'
}

Answer 3

我也遇到过类似的问题，不过我的解决方法是在karma.conf.js中添加如下代码：

esm: {
  nodeResolve: true,
},