DevsDawn
DevsDawn

在ThinkPHP中使用Laravel Mix

参照Laravel Mix文档,可以用在独立项目中,因此可以在ThinkPHP根目录下,参照Laravel项目,建立如下两个文件:

package.json

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "axios": "^0.19",
        "cross-env": "^5.1",
        "laravel-mix": "^4.0.7",
        "lodash": "^4.17.13",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0"
    }
}

webpack.mix.js

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

然后运行:

npm install

安装依赖。

编辑webpack.mix.js来指定需要打包的资源,操作方法与在Laravel下使用一致。可以参见:
https://learnku.com/docs/laravel/6.x/mix/5150
https://laravel-mix.com/docs/5.0/basic-example

编辑完成后,就可以使用:

npm run dev

或者

npm run prod

打包资源了。

若无特别说明,本文采用 CC BY-SA 4.0 协议进行许可。如需转载,请附上本文链接和本声明。
本文链接:https://devsdawn.com/2019/10/use-laravel-mix-in-thinkphp/
DigitalOcean云服务,美国上市公司,注册即送200USD体验金
Vultr云服务,全球25+地域,注册即送100USD体验金

发表回复

textsms
account_circle
email

DevsDawn

在ThinkPHP中使用Laravel Mix
参照Laravel Mix文档,可以用在独立项目中,因此可以在ThinkPHP根目录下,参照Laravel项目,建立如下两个文件: package.json { "private": true, "scripts": { "dev":…
扫描二维码继续阅读
2019-10-15