Tapable.plugin 已弃用答案

【问题标题】：Tapable.plugin is deprecatedTapable.plugin 已弃用
【发布时间】：2019-03-15 23:11:54
【问题描述】：

如何让 webpack/encore 运行？

yarn run encore dev --watch

yarn run v1.10.1
$ /var/www/html/symfony-dev/node_modules/.bin/encore dev --watch
Running webpack ...


webpack is watching the files…

(node:6631) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
/var/www/html/symfony-dev/node_modules/webpack/lib/Chunk.js:827
        throw new Error(
        ^

Error: Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead
    at Chunk.get (/var/www/html/symfony-dev/node_modules/webpack/lib/Chunk.js:827:9)

版本

yarn - v1.10.1
webpack - 3.5.6
extract-text-webpack-plugin - 4.0.0-beta.0
npm - 6.4.1
node - v10.10.0

Ubuntu 18.04 - Bionic Beaver

webpack.config.js

var Encore = require('@symfony/webpack-encore');

Encore
        // the project directory where compiled assets will be stored
        .setOutputPath('public/build/')
        // the public path used by the web server to access the previous directory
        .setPublicPath('/build')
        .cleanupOutputBeforeBuild()
        .enableSourceMaps(!Encore.isProduction())
        .addEntry('js/app', './assets/js/app.js')
        // uncomment to create hashed filenames (e.g. app.abc123.css)
        //.enableVersioning(Encore.isProduction())
        .enableVueLoader()
        //.enableSassLoader()
        ;

module.exports = Encore.getWebpackConfig(
        {
            devtool: 'inline-source-map',
            devServer: {
                contentBase: './dist'
            },
            module: {
                rules: [
                    {
                        test: /\.css$/,
                        use: [
                            'style-loader',
                            'css-loader'
                        ]
                    }
                ]

            }
        });

【问题讨论】：

你试过更新到 Webpack 4 吗？插件 api 被更改了，所以可能触发该错误的插件的作者也做了同样的事情
试过了，谢谢。还在尝试。

标签： webpack node-modules yarnpkg webpack-encore

【解决方案1】：

我的解决方案

环境 - Ubuntu 18.04、PHP 7、symfony 4.x

使用 npm 安装包，直到一切运行。从 webpack 3.5.6 开始

命令

rm -rf node_modules
npm cache clean --force
yarn cache clean
npm install webpack@3.5.6
npm install @symfony/webpack-encore --save-dev
npm i vue vue-template-compiler vue-template vue-loader
npm i babel-loader
npm i @babel/core --save-dev
npm i bootstrap-vue
npm i extract-text-webpack-plugin
npm i bootstrap
npm install --save

package.json

{
  "devDependencies": {
    "@babel/core": "^7.1.2",
    "@symfony/webpack-encore": "^0.17.1",
    "css-loader": "^1.0.0",
    "html-webpack-plugin": "^3.2.0",
    "style-loader": "^0.23.1",
    "vue": "^2.5.17",
    "vue-loader": "^14.2.3",
    "vue-template-compiler": "^2.5.17"
  },
  "license": "UNLICENSED",
  "private": true,
  "scripts": {
    "dev-server": "encore dev-server",
    "dev": "encore dev",
    "watch": "encore dev --watch",
    "build": "encore production"
  },
  "dependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.4",
    "bootstrap": "^4.1.3",
    "bootstrap-vue": "^2.0.0-rc.11",
    "clean-self-webpack-plugin": "^2.0.3",
    "extract-text-webpack-plugin": "^3.0.2",
    "file-loader": "^2.0.0",
    "uglifyjs-webpack-plugin": "^2.0.1",
    "vue-template": "^1.0.3",
    "webpack": "^3.5.6",
    "webpack-cli": "^3.1.2"
  }
}

【讨论】：