尝试在我的react组件中导入以下内容时出错:
import FontIconPicker from '@fonticonpicker/react-fonticonpicker';
import '@fonticonpicker/react-fonticonpicker/dist/fonticonpicker.base-theme.react.css';
Run Code Online (Sandbox Code Playgroud)
我正在使用这个模块:https://fonticonpicker.github.io/react-fonticonpicker/
我收到此错误:
./node_modules/@fonticonpicker/react-fonticonpicker/dist/fonticonpicker.base-theme.react.css模块解析失败:意外字符'@'(18:0)您可能需要一个合适的加载器来处理此文件类型.|*| / | @ font-face {font-family:fontIconPicker; src:url(assets/fontIconPicker.ttf)format("truetype"),url(assets/fontIconPicker.woff)format("woff"),url(assets/fontIconPicker.svg #fontIconPicker)format("svg"); font-weight:400; font-style:normal} [class ="fipicon - "],[class ^ = fipicon - ] {font-family:fontIconPicker!important; speak:none ;字体样式 .......
可以使用我的github代码重现该错误:https://github.com/gregbia/my-app
使用npm install
,并且npm start
会显示错误.
我的webpack看起来像这样:
/**
* Webpack Configuration
*
* Working of a Webpack can be very simple or complex. This is an intenally simple
* build configuration.
*
* Webpack basics — If you are new …
Run Code Online (Sandbox Code Playgroud) 我对古腾堡完全陌生,我需要在设置部分添加一个新选项卡请检查此屏幕截图
我已经为古腾堡创建了一些块,但没有这方面的经验。我试过这段代码
import { TabPanel } from '@wordpress/components';
const onSelect = ( tabName ) => {
console.log( 'Selecting tab', tabName );
};
const MyTabPanel = () => (
<TabPanel className="my-tab-panel"
activeClass="active-tab"
onSelect={ onSelect }
tabs={ [
{
name: 'tab1',
title: 'Tab 1',
className: 'tab-one',
},
{
name: 'tab2',
title: 'Tab 2',
className: 'tab-two',
},
] }>
{
( tab ) => <p>{ tab.title }</p>
}
</TabPanel>
);
Run Code Online (Sandbox Code Playgroud)
但没有帮助我。这里有人请帮助我。提前致谢
wordpress reactjs wordpress-gutenberg gutenberg-blocks create-guten-block
我想Section
在 WordPress Gutenberg 中创建一个块。我创建了一个部分块并使用古腾堡<InnerBlocks>
组件作为内部/子块。它工作正常,但Section
块本身显示为其内部块列表。我想Section
从其内部块中排除该块。<InnerBlocks>
组件有一个属性allowedBlocks
来指定允许作为内部块的块。但这对我没有帮助,因为我只想禁止Section
来自内部块的块。我如何才能仅禁止来自 的单个特定块<InnerBlocks>
?
我需要一个像这样的选项,disallowedBlocks
以便我可以从innerBlocks列表中排除块,例如
<InnerBlocks disallowedBlocks={['leo-block/section']} />
完整代码
;(function(wp) {
const {registerBlockType} = wp.blocks;
const {InnerBlocks} = wp.editor;
const {__} = wp.i18n;
registerBlockType('leo-block/section', {
title: __('Section'),
icon: 'grid-view',
category: 'vr-blocks',
descrition: __('Section block for manage content section'),
attributes: {
content: {
default: 'Hello World'
},
spacing: {
default: {
paddingTop: '70px',
paddingBottom: '70px',
marginTop: '0',
marginBottom: '0'
}
}
}, …
Run Code Online (Sandbox Code Playgroud) wordpress wordpress-gutenberg gutenberg-blocks create-guten-block