我试图使用webpack 将插件(freezeframe插件)包含到我的应用程序中,但我无法理解如何操作.我从我的应用程序本地提供此文件,而不是从cdn或npm/bower.我已经搜遍了所有尝试解决这个问题,但一直无法接近.
我的webpack文件如下所示:
const webpack = require('webpack');
const conf = require('./gulp.conf');
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const autoprefixer = require('autoprefixer');
module.exports = {
module: {
preLoaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'eslint'
}
],
loaders: [
{
test: /.json$/,
loaders: [
'json'
]
},
{
test: /\.gif$/,
loader: 'url-loader',
query: { mimetype: 'image/gif' }
},
{
test: /\.svg$/,
loader: 'svg-loader?pngScale=2'
},
{
test: /\.(eot|woff|woff2|ttf|svg|png|jpg)$/,
loader: 'url-loader?limit=30000&name=[name]-[hash].[ext]'
},
{
test: /\.(css|scss)$/,
loaders: [
'style', …Run Code Online (Sandbox Code Playgroud) 我还在学习Angular并开始创建一个简单的网站.我在视图中有路由和一些逻辑,当网址在该页面上时,菜单项上有一个活动类.我开始看到的问题是,如果我将URL更改为/ to/home,我必须在路由和视图中更新它,并且还要检查逻辑是否应该是活动的.
我想知道是否有更好的方法让它干涸?
我的app.js文件如下所示:
angular.module('simpleApp', ['ngRoute'])
.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/home/index.html'
})
.when('/about', {
templateUrl: 'views/about/index.html',
controller: 'AboutController',
controllerAs: 'aboutCtrl'
})
.when('/services', {
templateUrl: 'views/services/index.html',
controller: 'ServicesController',
controllerAs: 'servicesCtrl'
})
.when('/contact', {
templateUrl: 'views/contact/index.html',
controller: 'ContactController',
controllerAs: 'contactCtrl'
})
.otherwise({
redirectTo: '/'
});
}]);
Run Code Online (Sandbox Code Playgroud)
我的index.html的部分视图如下所示:
<nav class="navbar navbar-inverse" ng-controller="NavController as navCtrl">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span …Run Code Online (Sandbox Code Playgroud) 我想点击一个 API,它会返回我需要用于反应网站的网站的所有路由。
我不完全确定如何去做,甚至谷歌一个例子。
我的代码如下所示:
ReactDOM.render(
<Router history={browserHistory}>
<Route path="/" component={App}>
<IndexRoute pageId={5} background="" component={Home}/>
<Route path="/your-journey" background="" pageId={7} component={YourJourney}/>
<Route path="/designed-for-you" background="" pageId={6} component={DesignedForYou}/>
<Route path="/join-us" background="" pageId={1} component={JoinUs}/>
<Route path="/get-in-touch" background="no-hero-image" pageId={4} component={GetInTouch}/>
<Route path="/legal-and-compliance" background="no-hero-image" pageId={8} component={Legal}/>
<Route path="/privacy" background="no-hero-image" pageId={9} component={Privacy}/>
</Route>
</Router>,
document.getElementById('root')
);
Run Code Online (Sandbox Code Playgroud)
Route path="/" 下的所有内容都需要来自 API。
我正在尝试为具有子组件并使用 注入的组件编写单元测试ng-content。我试图在测试中获取组件的查询列表,以便我可以在下面测试此函数,但似乎无法QueryList在单元测试中填充变量。
@ContentChildren(TabsContentComponent, { descendants: true, read: TabsContentComponent }) tabContent: QueryList<TabsContentComponent>;
onTabChange($event) {
this.tabContent.toArray().forEach((tab, index) => {
tab.isActive = false;
if ($event.value === tab.value) {
tab.isActive = true;
}
});
}
Run Code Online (Sandbox Code Playgroud)
这是我的组件:我有一个名为 TabsContentContainer 的组件,其中包含另一个名为 Tabs 的组件。看起来像这样:
<div class="flex flex-direction-column tabs-container">
<app-tabs (tabChange)='onTabChange($event)' [tabs]="tabs"></app-tabs>
<ng-content></ng-content>
Run Code Online (Sandbox Code Playgroud)
我如何使用TabsContentContainer该组件(这只是它的模拟版本,减去了 app-tabs 组件):
<app-tabs-container>
<app-tabs-content>content goes here</app-tabs-content>
<app-tabs-content>content goes here</app-tabs-content>
<app-tabs-content>content goes here</app-tabs-content>
Run Code Online (Sandbox Code Playgroud)
我尝试遵循另一个答案来弄清楚该怎么做,因为它是相当旧的答案,但我似乎无法让我的模拟组件返回我QueryList的app-tabs-content.
这是我的规格文件:
@Component({
selector: 'app-tabs-container-mock-component',
template: `<app-tabs-container>
<app-tabs-content></app-tabs-content>
<app-tabs-content></app-tabs-content>
<app-tabs-content></app-tabs-content>
</app-tabs-container>` …Run Code Online (Sandbox Code Playgroud) 我一直在尝试编写测试以测试axios调用,但现在需要测试该catch部件。
我已经能够通过像这样模拟axios来做到这一点,但似乎无法找到一种方法来测试捕获。我遵循了许多来自堆栈溢出和网络的不同示例。
jest.mock('axios', () => jest.fn(() => Promise.resolve({ data: mockData })));
Run Code Online (Sandbox Code Playgroud)
但这总是会返回一个好的结果,因此无法测试捕获。我要测试的代码是:goToUrl()只是一个window.location.assign(url)但导入了。
fetchBundlesFromApi(params)
.then(({ data: { bundles } }) => {
updateBundles(bundles);
this.setState({ showUpdatingPrices: false });
})
.catch(() => goToUrl(bundlesUrl));
Run Code Online (Sandbox Code Playgroud)
在我的测试中,.then()我这样做:
const fetchedBundles = await fetchBundlesFromApi(
'?params',
);
expect(fetchedBundles.data).toEqual(mockData);
Run Code Online (Sandbox Code Playgroud)
但是,如果我遵循类似的示例,在React中使用Jestget模拟Axios- 不调用模拟功能,如果将模拟axios文件放在文件夹中,__mocks__则无法手动模拟,那么很多测试失败了,所以我只想模拟它在这个测试文件中。
这是我尝试执行的示例之一:
jest.mock('axios', () => ({
get: () => jest.fn(() => Promise.resolve({ data: mockData })),
default: () => jest.fn(() => Promise.resolve({ data: mockData })),
}));
Run Code Online (Sandbox Code Playgroud)
但是测试错误 …
我似乎无法找到语法错误.这是有问题的代码:
<div class='related_row'>
<?php
foreach($postList as $post):
setup_postdata( $post );
?>
<div class='related_product'>
<?php if(has_post_thumbnail() ) : ?>
<div class='related_image'>
<a class='service_overlay' href='<?php the_permalink(); ?>'></a>
<a class='service_page' href='<?php the_permalink(); ?>'><?php the_post_thumbnail(); ?></a>
</div>
<?php else: ?>
<div class='related_image'>
<a class='service_overlay' href='<?php the_permalink(); ?>'></a>
<a class='service_page' href='<?php the_permalink(); ?>'><img src="<?php get_bloginfo() ?>/wp-content/uploads/2013/08/header_image.png" alt='Service image' /></a>
</div>
<?php endif; ?>
<div class='related_title'>
<a href='<?php the_permalink(); ?>'><?php the_title(); ?></a>
</div>
</div>
<?php $counter++; ?>
<?php if($counter % 3 == 0 && $counter < …Run Code Online (Sandbox Code Playgroud) javascript ×5
reactjs ×2
angular ×1
angularjs ×1
arrays ×1
axios ×1
jestjs ×1
php ×1
react-router ×1
syntax ×1
syntax-error ×1
unit-testing ×1
webpack ×1