小编geo*_*nto的帖子

我有:

1. 我要捆绑的JS文件.
2. 我想编译成CSS的LESS文件(将@imports解析为单个包).

我希望将这些指定为两个单独的输入并具有两个单独的输出(可能通过extract-text-webpack-plugin).Webpack有所有适当的插件/加载器来进行编译,但它似乎不喜欢分离.

我已经看到人们需要直接从JS获取LESS文件的例子,例如require('./app.less');,除了告诉webpack将这些文件包含在bundle中之外别无他法.这允许你只有一个入口点,但这对我来说似乎非常不对 - 为什么我的JS中的LESS与我的JS代码无关时需要LESS？

我尝试使用多个入口点,将条目JS和主LESS文件都放入其中,但是当使用多个入口点时,webpack会生成一个在加载时不执行JS的包 - 它将所有内容捆绑在一起,但不知道什么应该在启动时执行.

我只是使用webpack错了吗？我应该为这些单独的模块运行单独的webpack实例吗？如果我不打算将它们混合到我的JS中,我是否应该将webpack用于非JS资产？

我正在使用 NextJS 和 Fullcalendar。

我尝试fullcalendar在这个例子中使用动态导入（有关更多信息，这个示例解决方案来自这里）。

它奏效了，但有一个问题。几乎每 5 次刷新尝试中就有 1 次以错误告终Please import the top-level fullcalendar lib before attempting to import a plugin（就像这样，但在我的情况下版本是正确的）

之后，我发现 next/dynamic 的模块选项已被弃用。我认为这是我的问题的根源（我不确定 100%，但至少它已被弃用并需要更新）。

正如文档所说，处理动态导入的新方法是这样的：

const DynamicComponent = dynamic(() =>
  import('../components/hello').then((mod) => mod.Hello)
)

但是因为我们需要多次导入，所以我找到了这个解决方案。

目前，似乎一切正常，但我的代码无效。

import dynamic from "next/dynamic";
import { useEffect, useState } from "react";

import "@fullcalendar/common/main.css"; // @fullcalendar/react imports @fullcalendar/common
import "@fullcalendar/daygrid/main.css"; // @fullcalendar/timegrid imports @fullcalendar/daygrid
import "@fullcalendar/timegrid/main.css"; // @fullcalendar/timegrid is a …

我根据此文档创建了一个联系表单模块:https://apostrophecms.org/docs/tutorials/intermediate/forms.html

提交作品和提交的表单显示在"联系表单"管理菜单项下.

我还想为每次提交生成一封收件人电子邮件地址的电子邮件.撇号 - 片段 - 提交 - 小部件说我可以override the beforeInsert method to send email, if desired.

但是,我不确定应该在哪里覆盖此方法.

我应该beforeInsert在/lib/modules/contact-form/index.js self.submit方法中添加一个方法吗？

或者,我应该创建一个项目级别的撇号 - 片段 - 提交 - 窗口小部件的副本,并覆盖beforeInsert那里的方法(我觉得这可能太全局,因此不理想)？

最后,我应该涉及撇号 - 电子邮件吗？

我有表格字段,如<input type="text" placeholder="Name*">.然后我将CSS应用于占位符,因此它是灰色的.但是,我想将星号(*)更改为红色.我如何使用jQuery或Javascript定位属性中的那个字符？

开发一个 wordpress 网站并使用 webpack 捆绑资源。

我有一个设置，可以将 SCSS 编译为 CSS 等。我想缩小输出 CSS 并删除注释。我尝试添加optimize-css-assets-webpack-plugin并按照示例建议配置它，但它不起作用（没有错误）...

那么我如何修改这个 webpack 配置以便输出 (1) 去除注释并 (2) 缩小？

webpack.config.js：

const path = require("path");
const config = require('./config.js');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
  mode: 'production',
  entry: ["./src/app.js", "./src/scss/style.scss"],
  output: {
    path: path.resolve(__dirname, "wp-content/themes/ezdigital"),
    filename: "js/[name].js"
  },
  module: {
    rules: [
      {
        test: /\.scss$/,
        use: [
          {
            loader: "file-loader",
            options: {
              name: "[name].css"
            }
          },
          {
            loader: "extract-loader"
          },
          {
            loader: "css-loader?-url" …