Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/webpack/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
npm运行构建在bitbucket管道中失败,因为它可以';无法解析某些文件_Npm_Webpack_Bitbucket - Fatal编程技术网

npm运行构建在bitbucket管道中失败,因为它可以';无法解析某些文件

npm运行构建在bitbucket管道中失败,因为它可以';无法解析某些文件,npm,webpack,bitbucket,Npm,Webpack,Bitbucket,我制作了一个react应用程序,我将其弹出。在我的组件文件Grid.jsx中有: 导入“/grid.scss” 但是,当我使用npm运行build:dev进行构建时,./src/App/components/wall/grid/grid.jsx中有一个错误:错误 未找到模块:错误:无法解析“./grid.scss” 我不理解,因为两个文件都在同一个文件夹中。另外,奇怪的是,如果我在mac上本地运行脚本npm run build:dev,一切都正常 有人能帮我找出错误吗?多谢各位 以下是全部错误:

我制作了一个react应用程序,我将其弹出。在我的组件文件
Grid.jsx
中有: 导入“/grid.scss”

但是,当我使用
npm运行build:dev
进行构建时,./src/App/components/wall/grid/grid.jsx中有一个错误:
错误
未找到模块:错误:无法解析“./grid.scss”

我不理解,因为两个文件都在同一个文件夹中。另外,奇怪的是,如果我在mac上本地运行脚本
npm run build:dev
,一切都正常

有人能帮我找出错误吗?多谢各位

以下是全部错误:

+ npm run build:dev
[13:39:06] Starting 'build'...
[13:39:06] Starting 'clean'...
[13:39:06] Finished 'clean' after 12 ms
[13:39:06] Starting 'copy'...
[13:39:06] Finished 'copy' after 22 ms
[13:39:06] Starting 'bundle'...
(node:176) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
Version: webpack 4.29.0
Time: 3609ms
                              Asset      Size   Chunks             Chunk Names
       main.5f3b72bf84d173109fc1.js  1.96 MiB     main  [emitted]  main
   main.5f3b72bf84d173109fc1.js.map   1.9 MiB     main  [emitted]  main
    vendors.5f3b72bf84d173109fc1.js   278 KiB  vendors  [emitted]  vendors
vendors.5f3b72bf84d173109fc1.js.map   289 KiB  vendors  [emitted]  vendors
ERROR in ./src/App/components/wall/grid/Grid.jsx
Module not found: Error: Can't resolve './grid.scss' in '/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid'
resolve './grid.scss' in '/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid'
  using description file: /opt/atlassian/pipelines/agent/build/package.json (relative path: ./src/App/components/wall/grid)
    Field 'browser' doesn't contain a valid alias configuration
    using description file: /opt/atlassian/pipelines/agent/build/package.json (relative path: ./src/App/components/wall/grid/grid.scss)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss doesn't exist
      .web.js
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.web.js doesn't exist
      .mjs
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.mjs doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.js doesn't exist
      .json
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.json doesn't exist
      .web.jsx
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.web.jsx doesn't exist
      .jsx
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.jsx doesn't exist
      .scss
        Field 'browser' doesn't contain a valid alias configuration
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.scss doesn't exist
      as directory
        /opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss doesn't exist
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.web.js]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.mjs]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.js]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.json]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.web.jsx]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.jsx]
[/opt/atlassian/pipelines/agent/build/src/App/components/wall/grid/grid.scss.scss]
 @ ./src/App/components/wall/grid/Grid.jsx 45:0-22
 @ ./src/App/components/wall/Wall.js
 @ ./src/App/App.js
 @ ./src/index.js
以下是我的管道步骤:

pipelines:
  branches:
   develop:
        - step:
            name: Build Dev
            caches:
              - node
            script: # Modify the commands below to build your repository.
            - node -v
            - npm set progress=false && npm install
            - npm test
            - npm run build:dev
            artifacts:
             - build/**
这是我的网页配置:

const webpack = require('webpack');
const path = require('path');
const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');

// import React from 'react';   
// import ReactDOM from 'react-dom';
// plugins
const CleanWebpackPlugin = require('clean-webpack-plugin');
const AutoCleanBuildPlugin = require('webpack-auto-clean-build-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const WebpackChunkHash = require('webpack-chunk-hash');
const AssetsWebpackPlugin = require('assets-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const JavaScriptObfuscator = require('webpack-obfuscator');
const BuildInfo = require('./tools/build-info');
const version = process.env.RELEASE_TAG || BuildInfo.releaseTag;
// Get environment variables to inject into our app.
const getClientEnvironment = require('./config/env');
const env = getClientEnvironment('');
const DEBUG = !process.argv.includes('--production') && process.env.NODE_ENV !== 'production';
const ANALYSER = process.argv.includes('--analyse');
const VERBOSE = process.argv.includes('--verbose');
const GLOBALS = {
  'process.env.NODE_ENV': DEBUG ? '"development"' : '"production"',
  __DEV__: DEBUG
};
//
const config = {
    mode: DEBUG ? 'development' : 'production',

    // You may want 'eval' instead if you prefer to see the compiled output in DevTools.
    // See the discussion in https://github.com/facebookincubator/create-react-app/issues/343.
    devtool: 'cheap-module-source-map',
    // These are the "entry points" to our application.
    // This means they will be the "root" imports that are included in JS bundle.
    // The first two entry points enable "hot" CSS and auto-refreshes for JS.
    // context: path.resolve(__dirname, 'src'),
    entry: {
      main: path.resolve(__dirname, './src/index.js'),
      vendors: ['react', 'react-redux', 'redux', 'react-router']
    },

    resolve: {
      extensions: ['.web.js', '.mjs', '.js', '.json', '.web.jsx', '.jsx', ".scss"],
    },
    // resolve: {
    //   extensions: ['.js', '.jsx']
    // },

    output: {
      path: path.resolve(__dirname, './build/public/assets'),
      publicPath: './assets/',
      sourcePrefix: '  ',
      filename: '[name].[hash].js',
    },

    target: 'web',

    stats: {
      // fallback value for stats options when an option is not defined (has precedence over local webpack defaults)
      all: undefined,

      // Add asset Information
      assets: true,

      // Sort assets by a field
      // You can reverse the sort with `!field`.
      assetsSort: "field",

      // Add build date and time information
      builtAt: false,

      // Add information about cached (not built) modules
      cached: false,

      // Show cached assets (setting this to `false` only shows emitted files)
      cachedAssets: false,

      // Add children information
      children: false,

      // Add chunk information (setting this to `false` allows for a less verbose output)
      chunks: false,

      // Add namedChunkGroups information
      chunkGroups: false,

      // Add built modules information to chunk information
      chunkModules: false,

      // Add the origins of chunks and chunk merging info
      chunkOrigins: false,

      // Sort the chunks by a field
      // You can reverse the sort with `!field`. Default is `id`.
      chunksSort: "field",

      // `webpack --colors` equivalent
      colors: true,

      // Display the distance from the entry point for each module
      depth: false,

      // Display the entry points with the corresponding bundles
      entrypoints: false,

      // Add --env information
      env: false,

      // Add errors
      errors: true,

      // Add details to errors (like resolving log)
      errorDetails: true,

      // Add the hash of the compilation
      hash: false,

      // Set the maximum number of modules to be shown
      maxModules: 15,

      // Add built modules information
      modules: false,

      warnings: false,
    },

    module: {
      strictExportPresence: true,
      rules: [
           // All files with a '.ts' or '.tsx' extension will be handled by 'awesome-typescript-loader'.
          //  { test: /\.tsx?$/, loader: "awesome-typescript-loader" },

           // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
           { enforce: "pre", test: /\.js$/, loader: "source-map-loader" },
        {
          test: /\.scss$/,
          use: [
            "style-loader", // creates style nodes from JS strings
            "css-loader?url=false", // translates CSS into CommonJS
            "sass-loader" // compiles Sass to CSS, using Node Sass by default
          ]
        },
        {
          test: /\.css$/,
          use: [
            "style-loader", // creates style nodes from JS strings
            "css-loader?url=false", // translates CSS into CommonJS
          ]
        },
        {
          test: /\.jsx?$/,
          loader: 'babel-loader', /**/
          include: [
            path.resolve(__dirname, 'src'),
          ],
          query: {
            // https://github.com/babel/babel-loader#options
            cacheDirectory: DEBUG,

            // https://babeljs.io/docs/usage/options/
            babelrc: false,
            presets: [
              'react',
              'es2015',
              'stage-0',
            ],
            plugins: [
              'transform-runtime',
              [
                'transform-react-remove-prop-types',
                'transform-react-constant-elements',
                'transform-react-inline-elements',
              ],
            ],
          },
        },
        {
          test: /\.(jpe?g|png|gif|svg)$/,
          use: 'url-loader?limit=100000'
        },
        {
          test: /\.(png|woff|woff2|eot|ttf|svg|otf)(\?v=\d+\.\d+\.\d+)?$/,
          use: 'url-loader?limit=100000'
        },
        {
          test: /\.json$/,
          loader: 'json-loader'
        },
        {
          test: /\.txt$/,
          loader: 'raw-loader'
        },
      ]
    },
    // devtool: 'source-map',
    plugins: [
      new CaseSensitivePathsPlugin(),
      // webpack 3 scope hoisting
      new webpack.optimize.ModuleConcatenationPlugin(),
      // Define free variables
      // https://webpack.github.io/docs/list-of-plugins.html#defineplugin
      new webpack.DefinePlugin({
        ...GLOBALS,
        'process.env.BROWSER': true,
        'process.env.API_URL': JSON.stringify(process.env.API_URL),
        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
        'process.env.VERSION': JSON.stringify(version),
        ...env.stringified
      }),
      //
      new ExtractTextPlugin({
        filename: '[name]-[chunkhash].css',
        disable: false,
        allChunks: true
      }),
      // Plugin to replace a standard webpack chunk hashing with custom (md5) one.
      new WebpackChunkHash({
        algorithm: 'md5'
      }),
      // save stats
      new AssetsWebpackPlugin({
        filename: 'build/public/webpack-assets.json'
      })
    ],
    optimization: {
      splitChunks: {
        chunks: 'async',
        minSize:
          30000,
        maxSize:
          0,
        minChunks:
          1,
        maxAsyncRequests:
          5,
        maxInitialRequests:
          3,
        automaticNameDelimiter:
          '~',
        name:
          true,
        cacheGroups:
          {
            vendors: {
              test: /[\\/]node_modules[\\/]/,
              priority:
                -10
            }
            ,
            default:
              {
                minChunks: 2,
                priority:
                  -20,
                reuseExistingChunk:
                  true
              }
          }
      }
      ,

      occurrenceOrder: DEBUG,
      minimizer:
        [
          new UglifyJsPlugin({
            parallel: true,
            sourceMap: false,
            uglifyOptions: {
              mangle: false,
              beautify: DEBUG,
              minimize: !DEBUG,
              // Eliminate comments
              comments: false,
              // Compression specific options
              compress: {
                warnings: false,
                // Drop `console` statements
                drop_console: DEBUG
              }
            }
          })
        ]
    }
    ,
    externals: {
      // "react": "React",
      // "react-dom": "ReactDOM"
  }
  }
;

// DEV ONLY Configuration
// Add a bundle analyser viewer
if (ANALYSER) {
  config.plugins.push(new BundleAnalyzerPlugin({
    analyzerMode: 'static',
    openAnalyzer: false
  }));
}

if (!DEBUG) {
  console.log("Obfuscating ...");
  config.plugins.push(new JavaScriptObfuscator({
    rotateUnicodeArray: true
  }));
}

module.exports = config;

好的,很抱歉,这是因为
grid.scss
未被推送到远程存储库,因为
.git
配置中的
ignoreCase
已设置为true。所以不知怎么的,它被git忽略了。这就是为什么它在本地起作用,而不是在管道中