Symfony4.2资产编译

时间:2019-01-11 23:32:06

标签: symfony assets symfony4 webpack-encore

我有一个使用Symfony4.2的应用程序,但是从4.0开始,然后是4.1。

似乎资产编辑在4.2中进行了更改,现在有{{ encore_entry_link_tags('app') }}entrypoints.jsonruntime.js

或者这最后两个文件应该在那里。

我当然安装了link这样的webpack-encore-bundle + npm / yarn软件包。

但是当我使用yarn encore dev./node_modules/.bin/encore dev进行编译时,这些文件不在我的build文件夹中。

所以我有使用encore_entry_link_tags的例外情况:

An exception has been thrown during the rendering of a template ("Could not find the entrypoints file from Webpack: the file "/path/to/.../public/build/entrypoints.json" does not exist.").

我使用fomantic-ui作为前端库,它似乎无法与yarn(yarn install raise some exceptions)配合使用,因此可能未安装所有软件包?

我尝试使用npm install而不是yarn install,但是似乎缺少了一些东西,我仍然没有这些entrypoint.jsonruntime.js文件。

有关信息,这是我的webpackConfig

// webpack.config.js
let Encore = require('@symfony/webpack-encore');

Encore
// the project directory where all compiled assets will be stored
    .setOutputPath('public/build/')

    // the public path used by the web server to access the previous directory
    .setPublicPath((!Encore.isProduction()) ? '/rapp/build' : '/build')

    // this is now needed so that your manifest.json keys are still `build/foo.js`
    // i.e. you won't need to change anything in your Symfony app
    .setManifestKeyPrefix('build')

    // will create public/build/main.js and public/build/main.css
    .addEntry('main', './assets/js/main.js')
    //Add entry if other js/css needed. first parameter is the generated filename.
    //require scss file in js. (if you addEntry for scss file only, it will create a js file with same name)
    .addEntry('reader', './assets/js/reader.js')

    //file upload with dropzone
    .addEntry('dropzone', './assets/js/dropzone.js')

    //Admin chapter js
    .addEntry('admin-chapter', './assets/js/chapter.js')

    .addEntry('admin-unfollow', './assets/js/backend/unfollow.js')

    //addStyleEntry : for css file only
    .addStyleEntry('public', './assets/css/public.scss')

    // allow sass/scss files to be processed
    .enableSassLoader()

    // allow legacy applications to use $/jQuery as a global variable
    .autoProvidejQuery()

    .enableSourceMaps(!Encore.isProduction())

    // empty the outputPath dir before each build
    .cleanupOutputBeforeBuild()

// create hashed filenames (e.g. app.abc123.css)
    .enableVersioning()

    .createSharedEntry('vendor', [
        'jquery',
    ])

    .autoProvideVariables({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery',
    })

    /*.copyFiles({
        from: './assets/img',
        // optional target path, relative to the output dir
        //to: 'images/[path][name].[ext]',

        // if versioning is enabled, add the file hash too
        to: 'images/[path][name].[hash:8].[ext]',

        // only copy files matching this pattern
        pattern: /\.(png|jpg|jpeg|gif|ico|svg|webp)$/
    })*/

    .configureFilenames({
        images: '[path][name].[hash:8].[ext]'
    })
;

// export the final configuration
module.exports = Encore.getWebpackConfig();

在webpackConfig中,copyFiles方法也会引发异常:Error: Encore.copyFiles is not a recognized property or method.

我不知道我是否通过从symfony4.1升级并安装encore js和bundle完全弄乱了东​​西,但是看来新的Symfony资产已经坏了。

编辑:

我遵循了here的步骤,但现在出现了异常,阻止了所有编译。

"./node_modules/.bin/encore" dev Running webpack ...

D:\PhpStormProjects\bookuto\node_modules\webpack-cli\bin\cli.js:235
                                throw err;
                                ^

TypeError: Cannot destructure property `createHash` of 'undefined' or 'null'.
    at Object.<anonymous> (D:\PhpStormProjects\bookuto\node_modules\mini-css-extract-plugin\dist\index.js:26:44)
    at Module._compile (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (D:\PhpStormProjects\bookuto\node_modules\mini-css-extract-plugin\dist\cjs.js:3:18)
    at Module._compile (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (D:\PhpStormProjects\bookuto\node_modules\@symfony\webpack-encore\lib\loaders\css-extract.js:12:30)
    at Module._compile (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)
    at Module.require (internal/modules/cjs/loader.js:636:17)
    at require (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (D:\PhpStormProjects\bookuto\node_modules\@symfony\webpack-encore\lib\config-generator.js:12:30)
    at Module._compile (D:\PhpStormProjects\bookuto\node_modules\v8-compile-cache\v8-compile-cache.js:178:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
    at Module.load (internal/modules/cjs/loader.js:598:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
    at Function.Module._load (internal/modules/cjs/loader.js:529:3)

yarn encore dev发生相同的错误。

1 个答案:

答案 0 :(得分:1)

我设法解决了这个问题!

对于拥有“旧” symfony应用程序的人,请注意

  • 更新Webpack版本,例如:t<int>(s);

编译webpackEncore时会发出警告:"webpack": "^4.28.4" 但是,就我而言,如果我从WARNING Webpack is already provided by Webpack Encore, also adding it to your package.json file may cause issues.中删除了webpack,它完全停止工作,并说“未找到webpack”或类似的内容

  • 将您的package.json更新为至少"@symfony/webpack-encore"

  • 如果没有"^0.21.0",请添加以下以下配置文件

symfony-flex

assets.yaml

framework: assets: json_manifest_path: '%kernel.project_dir%/public/build/manifest.json'

webpack_encore.yaml

在您的webpack_encore: # The path where Encore is building the assets. # This should match Encore.setOutputPath() in webpack.config.js. output_path: '%kernel.project_dir%/public/build'

bundles.php
  • 至少将您的Symfony\WebpackEncoreBundle\WebpackEncoreBundle::class => ['all' => true], 更新为"sass-loader"(建议,如果您的版本较低,则会对webpack配置文件中的某些功能产生影响。)

希望我没有错过任何东西,它可以帮助其他人。