小编adr*_*nay的帖子

我一直试图在我的应用程序中实现一些身份验证组件几个小时,我仍然不理解正在发生的一些事情.

基本上,我想发送一个POST request包含一些credentials我的API,cookie如果凭证有效,它会给我一个带有令牌的后面.然后,cookie应该包含在我API的所有未来请求的标题中(我认为这是自动的).

server.js(我的API现在是一个模型,带有JSON文件)

...
app.post('/api/login', jsonParser, (req, res) => {
  fs.readFile(ACCOUNTS_FILE, (err, data) => {
    if (err) {
      console.error(err);
      process.exit(1);
    }

    const accounts = JSON.parse(data);
    const credentials = {
      email: req.body.email,
      password: req.body.password,
    };
    var token = null;

    for (var i = 0; i < accounts.length; ++i) {
      const account = accounts[i];

      if (account.email === credentials.email
      && account.password === credentials.password) {
        token = account.token;
        break;
      }
    }

    if (token) {
      res.setHeader('Set-Cookie', …

我的网站在IE11中完全破碎了.问题来自于flex: 1 1 0%;,由于autoprefixer和postcss-flexbugs-fixes我到处使用.

当我将其flex: 1 1 auto;更改为时,该网站确实可以在IE上运行,但随后某些行为也会发生变化(例如,一个带有两个flex: 1 1 auto;孩子的弹性箱不会占用完全相同的空间).因此,这个解决方案在其他浏览器上破坏了我的设计(虽然在IE11上使它更好 - 而不是破坏).

人们如何设法使用Flexbox构建自己的网站在IE11上运行？

编辑:这是一支笔,突出了我面临的问题:https://codepen.io/Zephir77167/pen/GMjBrd(在Chrome和IE11上试试).

Edit2:这是代码:

HTML:

<div id="a" class="flex">
  <div id="b" class="item flex-1">
    Hey
  </div>
  <div id="c" class="item flex-0">
    Ho
  </div>
  <div id="d" class="item flex-1">
    Heyheyheyheyho
  </div>
</div>
<br />
<div id="a" class="flex">
  <div id="b" class="item flex-1-variation">
    Hey
  </div>
  <div id="c" class="item flex-0">
    Ho
  </div>
  <div id="d" class="item flex-1-variation">
    Heyheyheyheyho
  </div>
</div>

CSS:

* { …

我想和babel 7一起使用react-native,所以我也可以使用babel-preset-typescript.

这是一个最小的存储库(我正在努力工作):https://github.com/adrienharnay/react-native-init-typescript

有没有人设法做到这一点？

编辑2 :编辑正则表达式以匹配窗口的文件路径,现在正在进行代码拆分.但我的子路径的子组件仍然无法加载.

编辑:我的代码自上周以来发生了变化,但我仍然坚持这个问题(我需要以声明的方式声明我的路由,所以使用JSX).

首先,我正在使用Webpack 1.x与React,react-router,bundle-loader,Babel6,ES6和airbnb-eslint-config.

我试着根据React的庞大应用程序示例关注Henley Edition关于代码分割和加载块(以及它的示例repo)的文章.

但是我无法让bundle-loader将我的代码拆分成块...

这是我的代码:

webpack.config.js

const webpack = require('webpack');
const path = require('path');

const nodeDir = `${__dirname}/node_modules`;

const routeComponentRegex = /src[\/\\]views[\/\\]([^\/\\]+)[\/\\]js[\/\\]([^\/\\]+).js$/;
const paths = [ // Only to test which files match the regex, juste in case
  'src/views/index/js/Index.js',
  'src/views/login-page/js/LoginForm.js',
  'src/common/main-content/js/MainContent.js',
  'src/routes/main.js',
];

console.log(routeComponentRegex.test(paths[0])); // prints 'true'
console.log(routeComponentRegex.test(paths[1])); // prints 'true'
console.log(routeComponentRegex.test(paths[2])); // prints 'false'
console.log(routeComponentRegex.test(paths[3])); // prints 'false'

const config = {
  resolve: …

我在我的项目中引入了代码覆盖率,但所有值(除了一个)都被置于零.

这是我的jest-config.json:

{
  "collectCoverageFrom": [
    "../shared/utils/*.js"
  ],
  "coverageDirectory": "<rootDir>/coverage",
  "coverageThreshold": {
    "global": {
      "branches": 0,
      "functions": 0,
      "lines": 0,
      "statements": 0
    }
  },
  "moduleFileExtensions": [
    "js"
  ],
  "moduleNameMapper": {
    "\\.(css|scss)$": "identity-obj-proxy"
  },
  "moduleDirectories": [
    "node_modules",
    "job-board/node_modules"
  ],
  "modulePaths": [
    "<rootDir>/client"
  ],
  "roots": [
    "<rootDir>",
    "<rootDir>/../shared"
  ],
  "testRegex": "\\.test\\.js$"
}

我正在测试的文件正在进行中../shared/src/utils/*.js,我的测试都在../shared/src/utils/__tests__/*.test.js.

当我跑步时node --harmony_proxies node_modules/jest-cli/bin/jest.js --config ./jest-config.json --coverage,我得到了这个结果:

只是,这些文件中的几乎所有功能都经过了全面测试......

有人遇到过这个问题吗？

提前致谢.

我试图用react-hot-loader同webpack-dev-server和react-router,但是当我尝试访问本地主机:3000 /我得到:

Cannot GET /

当然,它在我尝试访问localhost:8000 /时有效.我试图遵循反应热模板,没有成功.

这是我的代码:

server.js

const http = require('http');
const express = require('express');
const consolidate = require('consolidate');
const bodyParser = require('body-parser');
const routes = require('./routes');

const app = express();

app.set('views', 'public/pages'); // Set the folder-name from where you serve the html page.
app.set('view engine', 'html');
app.engine('html', consolidate.handlebars);
app.use(express.static('public')); // Set the folder from where you serve all static files
app.use(express.static('public/dist')); // Set the folder from where you serve …

我已经Redux在我的React应用程序中实现了,到目前为止,这工作得很好,但我有一个小问题.

我的导航栏中有一个选项可以更改locale,存储在redux's state.当我改变它时,我希望每个组件都能重新发布以改变转换.要做到这一点,我必须指定

locale: state.locale

在mapStateToProps功能...这导致了很多代码重复.

有没有一种方法隐含传递现场为每个组件的道具connect与ED react-redux？

提前致谢!