升级 Materialise 1.0.0 -> 1.1.0

Posted 2023-05-07

【中文标题】升级 Materialise 1.0.0 -> 1.1.0

【英文标题】：Upgrade Materialize 1.0.0 -> 1.1.0

【发布时间】：2022-01-12 05:18:09

【问题描述】：

我正在编写 React 教程 project，使用的是 Materialize 1.0.0

旧代码直接从 materialize-css 包中导入 css 和 js 文件，如下所示：

import 'materialize-css/dist/css/materialize.min.css';
import M from 'materialize-css/dist/js/materialize.min.js';

我卸载了materialize-css 软件包，并安装了@materializecss/materialize，这是Materialize 的下一个版本。按照旧的逻辑，我正在尝试像这样导入 scc 和 js 文件：

import '@materializecss/materialize/dist/css/materialize.min.css';
import M from '@materializecss/materialize/dist/js/materialize.js'; // <-- Error here

我不断收到来自 VS Code 的警告消息：

Could not find a declaration file for module '@materializecss/materialize/dist/js/materialize.js'. 'e:/.../node_modules/@materializecss/materialize/dist/js/materialize.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/materializecss__materialize` if it exists or add a new declaration (.d.ts) file containing `declare module '@materializecss/materialize/dist/js/materialize.js';`ts(7016)
module "e:/Web Dev/Brad Traversy - React Front To Back/03-it-logger/node_modules/@materializecss/materialize/dist/js/materialize"

【问题讨论】：

没有实现 1.1.0 - 1.0.0 是当前和最新版本。

【参考方案1】：

我不再使用 M 变量了。

import '@materializecss/materialize/dist/css/materialize.min.css';
import '@materializecss/materialize/dist/js/materialize.min.js';

我只在我的 App.js 中导入这两个文件一次，我通过window.M 访问M，例如：

        // Init Materialize JS
        window.M.AutoInit();