問題

給定一個新的Laravel專案的webpack.mix.js:

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

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

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

什麼是隻使用webpack和webpack.config.js的等價物? (我想刪除laravel混合作為對現有專案的依賴.)

我在原始碼中找到了這個預設檔案,但它沒有幫助我.有沒有辦法可以看到“編譯/結果”webpack配置或對應於laravel混合預設設定的模板/起點?

  最佳答案

您引用的檔案似乎完全指向預設配置.為什麼這不起作用?

為了移徙你可以

  1. 學習基礎知識
  2. 從Laravel混合Award將它們新增到package.json中,從Laravel中提取依賴項

    • 提示:dependencies有你的devDependencies
    • 首先安裝npm install --save-dev所有“webpack”,“babel”並預先安裝“-loader”.
    • 如果您需要 Sass 並提取 css – npm install --save-dev node-sass sass-loader mini-css-extract-plugin
  3. 來自上面的混合示例的webpack配置的最小示例是
 const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
  entry: './resources/js/app.js',
  output: {
    filename: 'js/[name].js',
    path: path.join(__dirname, 'public')
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: 'css/[name].css'
    })
  ],
  module: {
    rules: [
      {
        test: /\.(sa|sc|c)ss$/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader,
          },
          'css-loader',
          'sass-loader'
        ]
      }
    ]
  }
};
 
  1. 為您的用例 學習 更先進的基礎知識

  相同標籤的其他問題

laravelwebpacklaravel-mix