0
私は大規模な静的HTMLバンドルを反応コンポーネントにロードしただけで、すべてをjsxに入力するという考えで遊んでいます。私は現在、ejs-loaderとhtml-react-parserを実験して、この可能性を評価しています。すべては実際にうまくレンダリングしますが、私はこのためにjestで動作するテストを得ることができません。要求テストモジュールでのテスト：ejs-loader
私はCannot find module ejs-loader!./AboutPage.view.ejsからAboutPage.jsのエラーと私は何をすべきか分かりません。
私は現在、これを実験するための基礎としてreact-slingshotを取り組んでいます。
プロジェクトのレポはhere
コンポーネント自体はシンプルです：
import React from 'react';
import Parser from 'html-react-parser';
import '../styles/about-page.css';
const view = require('ejs-loader!./AboutPage.view.ejs')();
// Since this component is simple and static, there's no parent container for it.
const AboutPage =() => {
return (
<div>
{Parser(view)}
</div>
);
};
export default AboutPage;とテストです：
import React from 'react';
import {shallow} from 'enzyme';
import AboutPage from './AboutPage';
describe('<AboutPage />',() => {
it('should have a header called \'About\'',() => {
const wrapper = shallow(<AboutPage />);
const actual = component.find('h2').text();
const expected = 'About';
expect(actual).toEqual(expected);
});
});the docsと同様の質問はthisのように読んでいます。私はカスタムトランスを使用しようとしましたが、呼び出されることさえないので、何かを誤解している可能性があります。
Package.json
"jest": {
"moduleNameMapper": {
"\\.(css|scss)$": "identity-obj-proxy",
"^.+\\.(gif|ttf|eot|svg|woff|woff2|ico)$": "<rootDir>/tools/fileMock.js"
},
"transform": {
"^.+\\.js$": "babel-jest",
"\\.(ejs|ejx)$": "<rootDir>/tools/ejx-loader/jest.transformer.js"
}
},と変圧器自体：
module.exports = {
process(src, filename, config, options){
console.log('????');
return 'module.exports = ' + require(`ejs-loader!./${filename}`);
//return require(`ejs-loader!./${filename}`);
}
};