admin管理员组

文章数量:1794759

think

think

think-webpack

在 ThinkPHP5.1/6中使用 webpack

使用了 symfony 的 encore, 更多使用请参考

.html

.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>

转载于:

本文标签： think

版权声明：本文标题：think 内容由林淑君副主任自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.xiehuijuan.com/baike/1692791218a200446.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。