think-webpack 给你的项目集成webpack

浏览:486 发布日期:2019/04/29 分类:ThinkPHP6专区 关键字: webpack
在 ThinkPHP5.1/6中使用 webpack
https://github.com/kuange/think-webpack
使用了 symfony 的 encore, 更多使用请参考
https://symfony.com/doc/current/frontend/encore/installation.html
https://symfony.com/doc/current/frontend.html
环境需求:
php >= 5.6
thinkphp >= 5.1/6

安装
执行命令 composer require kuange/think-webpack
依赖于 @symfony/webpack-encore , 安装 yarn add @symfony/webpack-encore --dev
复制文件到项目根目录 cp -r vendor/kuange/think-webpack/copy_files/* ./
复制之后, 将会在根目录下生成以下文件:|____webpack.config.js
|____assets
| |____css
| | |____app.css
| |____js
| | |____app.js
使用 yarn encore# 开发环境
yarn encore dev
# 实时编译, 刷新浏览器即可查看最新变更
yarn encore dev --watch
# 生产环境
yarn encore production
以上命令将会在 `pubic` 下生成 `build` 目录, 目录中是编译好的文件|____build
| |____entrypoints.json
| |____runtime.js
| |____app.css
| |____manifest.json
| |____app.js
在模板中使用<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>think-webpack</title>
    {:encore_link_tags('app')}
</head>
<body>
    <h1>think-webpack</h1>
    {:encore_script_tags('app')}
</body>
</html>
最佳答案
评论( 相关
后面还有条评论,点击查看>>